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.
Use
Expanded
for both the listColumn( children: <Widget>[ Expanded(child: _list1()), Expanded(child: _list2()), ], )
Give one
Expanded
and otherSizedBox
Column( children: <Widget>[ Expanded(child: _list1()), SizedBox(height: 200, child: _list2()), ], )
Use
SizedBox
for both of them.Column( children: <Widget>[ SizedBox(height: 200, child: _list1()), SizedBox(height: 200, child: _list2()), ], )
Use
Flexible
and you can changeflex
property in it, just likeExpanded
Column( children: <Widget>[ Flexible(child: _list1()), Flexible(child: _list2()), ], )
If you
ListView
is short enough to be able to fit inColumn
, useListView(shrinkWrap: true)
Wrapping ListView
in a fixed size Container
worked for me.