height - Flutter 垂直分隔线与其父级一样高

嗨 Flutter 社区:)

开发 Flutter 应用程序并寻求有关 UI 小部件的帮助。

我不知道如何根据 parent 的高度设置 child 的高度。

需要创建一个垂直分隔线(或具有自定义高度的容器)并将其高度设置为其父级的最大值，因为父级高度(在我的情况下是一列)将根据内部小部件而变化。

我找到了创建垂直分隔线但高度固定的方法。尝试使用 BoxFit、BoxConstraints、FittedBox 和其他几种方法，但未能设置父级的高度。

分隔线放置在 Container>Row>Column->Container 内，分隔线的高度应为 Column 的高度。

就像这张图片的例子:

https://i.stack.imgur.com/uUWjF.png

附言所有小部件都放置在一个 ListView 中

      Column(
         children: <Widget>[
            Container(
              color: Colors.blue,
              width: 5.0,
              //height: -> setting to maximum of its parent
            ),
          ],
        ),

最佳答案

您可以为此使用 IntrinsicHeight。
在此示例中，我将 Container 用于我的分隔线，因为我的分隔线需要边框半径，但您也可以使用 VerticalDivider。

IntrinsicHeight(
        child: Row(
          children: <Widget>[
            // This is your divider
            Container(
              width: 3,
              height: double.infinity,
              color: Colors.blue,
              margin: const EdgeInsets.only(right: 4),
            ),
            Column(
              children: <Widget>[
                Text(
                  'Text 1',
                  style: TextStyle(fontSize: 20),
                ),
                Text(
                  'Text 2',
                  style: TextStyle(fontSize: 20),
                ),
                Text(
                  'Text 3',
                  style: TextStyle(fontSize: 20),
                ),
              ],
            ),
          ],
        ),
      ),

This is the result
如果你只需要一个简单的分隔线，我建议你为容器添加边框，because documetnation for IntrinsicHeight 说调用起来很昂贵，所以尽可能避免使用它。
Here you can read more about adding border to the Container.

关于height - Flutter 垂直分隔线与其父级一样高，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52113356/