如何在 flutter 中将 Gridview 转换为 Listview？

Question

i would like to transform a GridView into a Listview, here is the Gridview code:

and here is what i tried to do:

      return ListView.builder(
 itemBuilder: (context,index){
     _buildGridCards(context); 
   }

   );
  }

    List<dynamic> _buildGridCards(BuildContext context) {
   if (widget.productsToDisplay == null || widget.productsToDisplay.isEmpty) {
    return const <Card>[];
     }
   final ThemeData theme = Theme.of(context);
    return widget.productsToDisplay.map((product) {
    Uint8List img64;
    try {
    img64 = base64Decode(product.image);
    } catch (e) {
    print(e);
    }

  return Card(
    clipBehavior: Clip.antiAlias,
    child: InkWell(
      onTap: () {
        Navigator.push(
          context,
             ...

when i executed the code, nothing appeared

Answer 1

I believe you forgot itemCount , so the final will be

return ListView.builder(
  itemCount: 3, // the data length of your list view
 itemBuilder: (context,index){
     _buildGridCards(context); 
   }

You may also check the flutter doc. I hope it helps.

Answer 2

the item builder requires you to return a widget of which it will render the widget in the list at a defined index...

you could keep calling the function _buildGridCards for each time the builder executes and have the following...

return ListView.builder(
  // Not forgetting to add the length ofcourse
  itemCount: _buildGridCards(context).length,
  itemBuilder: (context,index){
    return _buildGridCards(context)[index]; 
  }
);

or you could keep the list somewhere and only execute the function once like down here...

@Override
Widget build(BuildContext context) {
  List<Card> cards = _buildGridCards(context);

  return ListView.builder(
    // Not forgetting the length ofcourse
    itemCount: cards.length,
    itemBuilder: (context,index){
      return cards[index]; 
    }
  );
}

Hope this helps