Populate GridView from db in Flutter - database

Question

I want to retrive data from table in db and display it into GridView in Flutter.
At the moment I display it in a simple List but I can't display it in GridView.
Here is my code
return Scaffold(
appBar: AppBar(
title: Text("Diario di bordo"),
),
/*body: Center(
child: Text('Nessun diario presente'),
),*/
body: FutureBuilder<List>(
future: dbHelper.queryAllRows(),
initialData: List(),
builder: (context, snapshot) {
return snapshot.hasData
? ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (_, int position) {
final item = snapshot.data[position];
//get your item data here ...
return Card(
color: RandomColor().randomColor(),
child: ListTile(
title: Text(
snapshot.data[position].row[1]),
),
);
},
)
: Center(
child: CircularProgressIndicator(),
);
},
),
...
I searched on documentation and I see this piece of code
GridView.count(
// Create a grid with 2 columns. If you change the scrollDirection to
// horizontal, this produces 2 rows.
crossAxisCount: 2,
// Generate 100 widgets that display their index in the List.
children: List.generate(100, (index) {
return Center(
child: Text(
'Item $index',
style: Theme.of(context).textTheme.headline,
),
);
}),
);
I don't understand how retrive data from mytable in db and show it in GridView.

Answer 1

You can use the GridView.Builder
return snapshot.hasData?
GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2),
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
final item = snapshot.data[index];
//get your item data here ...
return Card(
color: RandomColor().randomColor(),
child: ListTile(
title: Text(
snapshot.data[index].row[1]),
),
);
},
)
: Center(
child: CircularProgressIndicator(),
);