列表视图和其他小部件之间的空间很大

时间:2018-12-27 10:58:00

标签: dart flutter

我有一个包含一列容器和列表视图的容器..通过这种方式:1.容器2.列表视图3.容器4.列表视图...我是这样做的:

Container(
        color: Colors.white,
        child: Stack(
          overflow: Overflow.visible,
          children: <Widget>[
            new Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                Container(
                  child: Padding(
                    padding: EdgeInsets.only(
                        right: 20.0, left: 20.0, top: 5.0, bottom: 5.0),
                    child: new Text(
                      "header1",
                    ),
                  ),
                  color: Color(0xfff8f8f8),
                ),
                Expanded(
                  child: ListView.builder(
                    itemCount: titles.length,
                    itemBuilder: (BuildContext context, int index) {
                      return new Padding(
                        padding: EdgeInsets.only(
                            left: 20.0, right: 20.0, top: 15.0),
                        child: .......
                      );
                    },
                  ),
                ),
                Container(
                  child: Padding(
                    padding: EdgeInsets.only(
                        right: 20.0, left: 20.0, top: 5.0, bottom: 5.0),
                    child: new Text(
                      "header2",
                    ),
                  ),
                  color: Color(0xfff8f8f8),
                ),
                Expanded(
                  child: ListView.builder(
                    itemCount: titles.length,
                    itemBuilder: (BuildContext context, int index) {
                      return new Padding(
                        padding: EdgeInsets.only(
                            left: 0.0, right: 0.0, top: 0.0),
                        child: .....
                      );
                    },
                  ),
                ),
              ],
            ),
          ],
        ),
      ),

我无法从列表视图中删除“展开” ..如果我这样做了,列表视图将不会出现在列中。

此外,我尝试使用Flexible,但存在相同的问题..

这满足了我的需要..但是在第一个列表视图和第二个容器之间有一个巨大的空间..如何根据内容的高度删除此空白空间并使列表视图的高度自动换行?

1 个答案:

答案 0 :(得分:0)

尝试使用此代码

ListView(
    shrinkWrap: true,
    children: <Widget>[
      Container(
        child: Padding(
          padding: EdgeInsets.only(
              right: 20.0, left: 20.0, top: 5.0, bottom: 5.0),
          child: new Text(
            "header1",
          ),
        ),
        color: Color(0xfff8f8f8),
      ),
      ListView.builder(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: titles.length,
        itemBuilder: (BuildContext context, int index) {
          return new Padding(
              padding: EdgeInsets.only(
                  left: 20.0, right: 20.0, top: 15.0),
              child: ListTile(title: Text(titles[index]),)
          );
        },
      ),
      Container(
        child: Padding(
          padding: EdgeInsets.only(
              right: 20.0, left: 20.0, top: 5.0, bottom: 5.0),
          child: new Text(
            "header2",
          ),
        ),
        color: Color(0xfff8f8f8),
      ),
      ListView.builder(
        physics: NeverScrollableScrollPhysics(),
        shrinkWrap: true,
        itemCount: titles.length,
        itemBuilder: (BuildContext context, int index) {
          return new Padding(
              padding: EdgeInsets.only(
                  left: 0.0, right: 0.0, top: 0.0),
              child: ListTile(title: Text(titles[index]),)
          );
        },
      ),
    ],
  ),