android - flutter :- Inside the PageView Image is not setting to fit the screen on width?

标签 android flutter flutter-layout flutter-dependencies

我使用 PageView 来实现查看寻呼机功能,并在每个页面上显示图像,并在每个页面上包含一些文本和按钮。 由于我使用 Stack 小部件将 View 相互放置,就像 Android 中的 Relative-layout 一样,但我的图像位于第一页PageView 未设置为适合屏幕 我已经尝试过如下解决方案
1).First link
2). Second Link
但没有得到正确的解决方案,我尝试了以下代码行,

class MyTutorialScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Material(
      child: PageIndicatorContainer(
        pageView: PageView(
          children: <Widget>[
            Stack(
      //////ON THIS SECTION I AM GETTIG PROBLEM
              children: <Widget>[
                Container(
      /////// NEED THE SOLUTION ON THIS SECTION 
                  color: Colors.yellow,
                  child: Image.asset('images/walkthrough_1.png',
                      fit: BoxFit.fitWidth),
                ),
                Positioned(
                    top: 40.0,
                    right: 40.0,
                    child: InkWell(
                      onTap: () {
                        print("HERE IS I AM");
                      },
                      child: Text(
                        "SKIP",
                        style: TextStyle(color: Colors.white),
                      ),
                    )),
                Positioned(
                  bottom: 48.0,
                  left: 10.0,
                  right: 10.0,
                  child: Column(
                    children: <Widget>[
                      Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Text(
                          "Welcome",
                          style: TextStyle(
                            fontSize: 20.0,
                            color: Colors.white,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.all(16.0),
                        child: Text(
                            "To The Ravindra Kushwaha App. \n One tap Club Destination !",
                            style: TextStyle(
                              fontSize: 20.0,
                              color: Colors.white,
                              fontWeight: FontWeight.bold,
                            ),
                            textAlign: TextAlign.center),
                      ),
                    ],
                  ),
                )
              ],
            ),
            Container(
              color: Colors.yellow,
              child: Image.asset('images/walkthrough_2.png', fit: BoxFit.cover),
            ),
            Container(
              color: Colors.blueAccent,
              child: Image.asset('images/walkthrough_3.png', fit: BoxFit.cover),
            )
          ],
        ),
        length: 3,
        align: IndicatorAlign.bottom,
        indicatorSpace: 5.0,
        indicatorColor: Colors.white,
        indicatorSelectorColor: Colors.purpleAccent,
        padding: EdgeInsets.all(10.0),
      ),
    );
  }
}

请检查我从上面的代码 enter image description here 中获得的屏幕

屏幕上方,如何去除右侧的白色?

我正在使用这个库作为指标

page_indicator: ^0.2.1

最佳答案

请使用下面的行根据设备宽度和高度显示图像。尝试下面的代码行,如有问题请告诉我

 Container(
    height: double.maxFinite, //// USE THIS FOR THE MATCH WIDTH AND HEIGHT
    width: double.maxFinite,
    child:
    Image.asset('images/walkthrough_3.png', fit: BoxFit.fill),
    )

关于android - flutter :- Inside the PageView Image is not setting to fit the screen on width?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58028101/

相关文章:

java - 从 JSONObject 父级获取 JSONObject

flutter - 如何在 Flutter App 中按时间注销?

flutter - Flutter 中基于百分比的布局

Flutter 在滚动 ListView 上显示和隐藏容器

flutter - 如何在 flutter 桌面中自定义 AppMenu(MenuBar)?

java - android Listview 不显示任何内容

android - SQLite - 如何查询空间引用?

java - 如何在android中创建一个体积圆

firebase - 如何从引用文档 (Firebase) 中的字段获取字符串数据

ruby-on-rails - WebSockets : Can connect but cannot subscribe to channel