Flutter web 在部署 web 应用程序时使用 singleChildScrollView 显示空白

Posted 2023-02-23

【中文标题】Flutter web 在部署 web 应用程序时使用 singleChildScrollView 显示空白

【英文标题】：Flutter web showing blank on using singleChildScrollView when deploying web app

【发布时间】：2021-09-15 22:09:13

【问题描述】：

Flutter web 在使用调试模式时不会显示任何错误，但在发布时会显示空白屏幕。

以下是代码：

class _AboutUsState extends State<AboutUs> 
 
  @override
  Widget build(BuildContext context) 
    var height = MediaQuery.of(context).size.height;
    var width = MediaQuery.of(context).size.width;
    var pad = EdgeInsets.only(top: height * 0.15);
    return Scaffold(
        appBar: AppBar(
          leading: IconButton(
              onPressed: () => Navigator.pop(context),
              icon: Icon(
                Icons.arrow_back,
                color: Colors.grey,
              )),
          backgroundColor: Colors.grey[50],
          title: Text(\\ widget here
          ),
        ),
        body: SingleChildScrollView(
          child: Container(
            padding: EdgeInsets.only(left: width * 0.1, right: width * 0.1),
            child: Column(
              children: [
                // widgets here                  ],
                )
              ],
            ),
          ),
        ));
  
 

我还附上了一张图片。

【问题讨论】：

只有在使用SingleChildScrollView时才会出现吗？

是的。任何包括滚动的东西。 （列表视图等）

ok 只测试body: 和Column 有三个孩子：Text、Expanded > ListView 和Text - 你看到顶部只有两个Texts吗？底部，它们之间什么都没有？

扩展在两者之间工作正常。

我认为身高是个问题。

【参考方案1】：

我认为这是空白，因为您没有为列表视图定义任何高度。

要使用列表视图，您应该定义它的宽度和高度。 为了测试，尝试用容器包裹它并给它高度和宽度。

return 
   Container(
     width:500,
     height:1000,
     child: Listview(
    children:[childA(),childB,etc()]));