Question

我对Flutter来说还比较陌生-我已经在我的应用程序上工作了几个月，并且在某些领域取得了良好的进展，但在其他领域却没有。我在弄清楚布置一系列我的屏幕的“正确方法”时遇到了麻烦，所有这些屏幕在某些方面都有些相似。

简而言之，除了应用程序栏外，脚手架还将容纳一个容器，其中有一个Cupertino分段控件。分段控件用于在其下方的IndexedStack控件之间切换。

堆栈的每个子项可以具有不同的内容-有时是列表视图，有时是具有许多文本输入，开关等的形式。因此，结构在逻辑上可能看起来像这样：

Body
  SegmentedControl
  IndexStack
    Child 1
    Child N

我的问题是我希望/需要堆栈中的所有子元素“填充身体的其余区域”。因此，例如，如果我可以在这里补一些数字：设备的高度为600 px，appbar的值为40，分段控件的值为60，则每个堆栈子项的值为500 px。但是在实践中，我似乎无法推断出身体的“剩余内容高度”。我希望（并认为）存在某种类型的布局小部件或容器小部件，它们可以“自动调整所有剩余空间的大小”，但到目前为止尚未找到它。我尝试了许多不同小部件的许多组合，但似乎没有一个能解决问题。这是我的布局代码的精简版块：

body: Container(
  child: Column(
    crossAxisAlignment: CrossAxisAlignment.center,
    children: <Widget>[
      Padding(
        padding: const EdgeInsets.only(top: 16.0, bottom: 16.0),
        child: CupertinoSegmentedControl(
          children: tabOptions,
          onValueChanged: tabChanged,
          groupValue: curTabIndex,
        ),
      ),
      Container(
        height: 400.0, //needs to be 'all the rest' instead of a constant
        width: double.infinity,
        child: ListView(
          children: <Widget>[
            Text(“Example Text - would really be list tiles"),
            Text(“displaying results of database query"),
          ],
        ),
      ),
     ],            
   ), 
 ),

我只显示了索引堆栈的一个孩子。实际上，我可以有几个。如果我不给持有ListView的Container有限的高度（以及某种宽度），RenderBox无法绘制，即出现错误。面临的挑战是让堆叠子对象占用尽可能多的水平和垂直空间，并且在其内容超出布局高度的情况下，使它们的内容“可滚动”。我会尝试任何人建议的方式...我敢肯定有办法做到这一点。

谢谢！

Answer 1

选项1：

将容器窗口小部件替换为已扩展，将在下面的可用空间上扩展

   Expanded(
   //Container(
    //height: 400.0, //needs to be 'all the rest' instead of a constant
   // width: double.infinity,
    child: ListView(

扩展文档：https://docs.flutter.io/flutter/widgets/Expanded-class.html

选项2：

使用MediaQuery.of（context）.size.height计算所需的高度。不知道这是否行得通，甚至不是一个好习惯。

颤振布局路障

1 个答案: