Search code examples
flutterlistviewgridview

I need to change this ListView to GridView Flutter


I need to change this ListView to GridView Flutter .Thanks

 @override
  Widget build(BuildContext context) {
    return Consumer<ShopCategoryModel>(
      builder: (_, model, __) => ListView.separated(
        shrinkWrap: true,
        separatorBuilder: (_, index) => const Divider(),
        itemBuilder: (_, index) => model.isGettingCategories
            ? _catLoadingItem()
            : _catItem(model.categories[index]),
        itemCount: model.isGettingCategories ? 5 : model.categories.length,
      ),
    );
  }

Solution

  • I have done minor modification to show it as a grid. Though if it is not as per you, please share the design you want to achieve.

    GridView.builder(
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: MediaQuery.of(context).orientation ==
                  Orientation.landscape ? 3: 2,
              crossAxisSpacing: 8,
              mainAxisSpacing: 8,
            )
            itemCount:model.isGettingCategories ? 5 : model.categories.length,
            shrinkWrap: true,
            itemBuilder: (_,index,)  => model.isGettingCategories
                ? _catLoadingItem()
                : _catItem(model.categories[index]),
          )