Question

当我将它作为Column小部件的子级放置时，无法成功使Stack小部件正常工作。我的意图是混合使用Stack布局和Column / Row布局方法，以获得两种方法的好处。当我运行代码时，编译给出了很少的错误消息：

════════（2）渲染库捕获异常 ═════════════════════════════════════════════════ RenderFlex 底部的无限像素溢出。用户创建的祖先导致错误的小部件是：脚手架文件：/// C：/Users/admin/AndroidStudioProjects/music_app/lib/main.dart：240：12

我运行代码时返回了白页。我究竟做错了什么？以下是代码段：

 body: Column(
          children: <Widget>[
           Container(
             child: Stack(
               children: <Widget>[
                 Positioned(
                   top: 100,
                   left: 50,
                   child: Container(
                     child: Text("Text is Located here"),
                   ),
                 ),
               ],
             ),
           )
          ],
        ),

任何帮助将不胜感激。谢谢

Answer 1

发生错误是因为您用Stack包装了Container小部件，如果没有提供height或width，它将扩展到整个屏幕。因此，只需为height提供自定义Container即可解决溢出错误。下面的工作代码：

body: Column(
        children: <Widget>[
          Container(
            color: Colors.blue,
            height: 200,
            child: Stack(
              children: <Widget>[
                Positioned(
                  top: 100,
                  left: 50,
                  child: Container(
                    child: Text("Text is Located here"),
                  ),
                ),
              ],
            ),
          )
        ],
      ),

我提供了一个测试height。您可能需要根据需要提供高度或宽度。

希望这能回答您的问题。

Answer 2

请尝试以下代码：-

body: Column(
          children: <Widget>[
            Positioned(
              top: 100,
              left: 50,
              child: Container(
                child: Text("Text is Located here"),
              ),
            ),
          ],
        ),

堆栈小部件无法作为“列”小部件的子代工作

2 个答案: