Putting Widget above a ListView in Flutter

Question

The below code is working fine with me for calling and displaying data from firestore:

return ListView(
 padding: const EdgeInsets.only(top: 20.0),
 children: snapshot.map((data) => _buildListItem(context, data)).toList(),
);

But If I tried to put it in a column so I add another widget above it, it fails and give stack overflow:

return Column(
    children: <Widget>[
    Text('Hellow'),
  ListView(
  padding: const EdgeInsets.only(top: 20.0),
  children: snapshot.map((data) => _buildListItem(context, data)).toList(),
)]);

Also In your `ListView` add - `shrinkWrap: true,` – anmol.majhail Dec 21 '18 at 16:17 — anmol.majhail, Dec 21 '18 at 16:17

score 45 · Accepted Answer · answered Dec 21 '18 at 16:07

45

You need to put your ListView inside an Expanded widget so it knows how much space it can fill.

return Column(
    children: <Widget>[
      Text('Hellow'),
      Expanded(
        child: ListView(
          padding: const EdgeInsets.only(top: 20.0),
          children:
              snapshot.map((data) => _buildListItem(context, data)).toList(),
        ),
      ),
    ],
  );

answered Dec 21 '18 at 16:07

Jordan Davies

9,925
6
40
51

2

Right answer. If you want the text to be scrollable also, then you have to wrap your column in CustomScrollView and use Sliverlist. – Ayush P Gupta Dec 22 '18 at 09:16

Putting Widget above a ListView in Flutter

1 Answers1

Linked