颤振扩展垂直线答案

【问题标题】：Flutter expanded vertical line颤振扩展垂直线
【发布时间】：2018-08-16 12:02:55
【问题描述】：

我有一个ListView，我需要在它的左边有一条扩展的垂直线（见下图）。我已经实现了以下布局，但它扩展到无限。

这是上述布局的代码：

return Scaffold(
  ...
  body: Column(
    children: <Widget>[
      Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
            margin: EdgeInsets.only(left: 4.0),
            color: Colors.grey,
            width: 4.0,
            child: SizedBox.expand(),
          ),
          Flexible(
            child: StreamBuilder( // Creates the list view
              stream: ...,
              builder: ...,
            ),
          ),
        ],
      ),
    ],
  ),
};

由于SizedBox.expand()，线条变得无限，但如何适应屏幕。有什么建议吗？

或者有没有办法从ListView 项目中获得同样的效果（没有固定大小）。

【问题讨论】：

为什么不直接用那个边框包裹你的 Column 而不是使用 Row 呢？
@RémiRousselet 然后我必须使用另一个 Row 来用线包裹 Column 和容器。对吗？

标签： android flutter flutter-layout

【解决方案1】：

如果您只有一个孩子，请不要将列用作父级，这对我有用：

  return Container(
        child: Row(
          children: <Widget>[
            Container(
              margin: EdgeInsets.only(left: 4.0),
              color: Colors.grey,
              width: 4.0,
            ),
            Expanded(
              child: ListView.builder(
                // Creates the list view
                shrinkWrap: true,
                itemCount: list.length,
                itemBuilder: (context, index) {
                  return ListTile(
                    contentPadding: EdgeInsets.all(20.0),
                    title: Text(list[index].toString()),
                  );
                },
              ),
            ),
          ],
        ),
      );

【讨论】：

如何获得width: 4.0的动态宽度？