如何将两个ListView放在一列中？

Question

我有两个带有 ExpansionTiles 的 ListView，我想将它们一个接一个地放置在一个列中，该列中首先包含一些其他 Widget。这是我的代码，

 @override
 Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
    appBar: new AppBar(
        title: new Text("Project Details"),
        backgroundColor: Colors.blue[800]),
    body:

    new Padding(padding: new EdgeInsets.all(10.0),
      child: new Column(children: <Widget>[
        new Text(project.name, style: new TextStyle(
            fontWeight: FontWeight.bold,
            color: Colors.blue[700],
            fontSize: 15.0
        )),
        new RowMaker("District", project.district),
        new RowMaker("River", project.river),
        new RowMaker("Tac Approved", project.tacApproved),
        new RowMaker("Func Sanctioned", project.fundSanctioned),
        new Row(children: <Widget>[
          new FlatButton(onPressed: null,
            color: Colors.blue,
            child: new Text("Gallery"),
            textColor: Colors.white,),
          new FlatButton(onPressed: null,
              color: Colors.blue,
              child: new Text("Upload Images"),
              textColor: Colors.white),
          new FlatButton(
              onPressed: null,
              color: Colors.blue,
              child: new Text("Update"),
              textColor: Colors.white),
        ],),
        new ListView(children: getSfListTiles()),
        new ListView(children: getWorkStatementTiles())


    ]
        ,
      )
      ,
    )
);

}

使用这个，小部件主体显示 blank.If 我直接将 ListView 设置为主体，它们显示正常。我错过了什么吗？

Answer 1

尝试将 ListView 包裹在 Expanded 中。它没有固有高度，所以你需要给它一个。

Answer 2

将 ListView 包装成固定尺寸 Container 对我有用。

Answer 3

您需要提供约束高度才能将 ListView 放入 Column。有很多方法可以做到，我在这里列出一些。

两个列表都使用Expanded

Column(
  children: <Widget>[
    Expanded(child: _list1()),
    Expanded(child: _list2()),
  ],
)

给一个Expanded和另一个SizedBox

Column(
  children: <Widget>[
    Expanded(child: _list1()),
    SizedBox(height: 200, child: _list2()),
  ],
)

两者都使用SizedBox。

Column(
  children: <Widget>[
    SizedBox(height: 200, child: _list1()),
    SizedBox(height: 200, child: _list2()),
  ],
)

使用Flexible可以在里面改flex属性，就像Expanded

Column(
  children: <Widget>[
    Flexible(child: _list1()),
    Flexible(child: _list2()),
  ],
)

如果你 ListView 足够矮可以装进 Column，请使用
```
ListView(shrinkWrap: true)
```

Answer 4

检查 link 而不是 listview 使用 sliverlist 以获得更好的性能

Tuturial 和 full Example

 return CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate(
                  (BuildContext context, int index) => Container(
                      height: 100,
                      color: Colors.red,
                      child: Text("List 1 item${index}")),
                  childCount: 5,
                ),
              ),
              SliverList(
                delegate: SliverChildBuilderDelegate(
                  (BuildContext context, int index) => Container(
                      height: 100,
                      color: Colors.blue,
                      child: Text("List 2 item${index}")),
                  childCount: 5,
                ),
              ),
            ],
          );

如何将两个ListView放在一列中？

How to put two ListView in a column?

flutter