How to put two ListView in a column?

check the link instead listview use sliverlist for better performance

Tuturial and 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,
                ),
              ),
            ],
          );

Try wrapping your ListView in Expanded. It doesn't have an intrinsic height so you need to give it one.


You need to provide constrained height to be able to put ListView inside Column. There are many ways of doing it, I am listing few here.

  1. Use Expanded for both the list

    Column(
      children: <Widget>[
        Expanded(child: _list1()),
        Expanded(child: _list2()),
      ],
    )
    
  2. Give one Expanded and other SizedBox

    Column(
      children: <Widget>[
        Expanded(child: _list1()),
        SizedBox(height: 200, child: _list2()),
      ],
    )
    
  3. Use SizedBox for both of them.

    Column(
      children: <Widget>[
        SizedBox(height: 200, child: _list1()),
        SizedBox(height: 200, child: _list2()),
      ],
    )
    
  4. Use Flexible and you can change flex property in it, just like Expanded

    Column(
      children: <Widget>[
        Flexible(child: _list1()),
        Flexible(child: _list2()),
      ],
    )
    
  5. If you ListView is short enough to be able to fit in Column, use

    ListView(shrinkWrap: true)
    

Wrapping ListView in a fixed size Container worked for me.

Tags:

Flutter