Home > Software engineering >  GridView.count() doesn't scroll - Flutter
GridView.count() doesn't scroll - Flutter

Time:06-28

I want the Card widgets to scroll horizontally, but it's not working. I've tried and changed GridView to ListView.

Adding physics is not helping either.

Here's the code:

@override
  Widget build(BuildContext context) {
    SizeConfig().init(context);
    return Expanded(
      child: Column(
        children: [
          Padding(
            padding: EdgeInsets.symmetric(
                vertical: SizeConfig.blockSizeVertical * 2),
            child: (Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  'Names',
                  style: Theme.of(context).textTheme.headline6,
                ),
                InkWell(
                  onTap: () {},
                  child: Row(children: [
                    Text('show more',
                        style: Theme.of(context).textTheme.caption),
                    const Padding(
                      padding: EdgeInsets.only(top: 2),
                      child: Icon(
                        Icons.keyboard_arrow_left_sharp,
                        size: 20,
                      ),
                    ),
                  ]),
                ),
              ],
            )),
          ),
          FutureBuilder<DataModel>(
              future: InfoAPI('assets/itemsData.json').getDataLocally(context),
              builder: (context, snapshot) {
                final data = snapshot.data;
                final List<String> list = getnames(data);

                return Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Theme.of(context).primaryColor,
                  ),
                  height: SizeConfig.blockSizeVertical * 20,
                  // width: double.infinity,

                  child: GridView.count(
                      crossAxisCount: 1,
                      padding: const EdgeInsets.symmetric(
                          vertical: 8.0, horizontal: 10.0),
                      scrollDirection: Axis.horizontal,
                      childAspectRatio: 1,
                      physics: const NeverScrollableScrollPhysics(),
                      shrinkWrap: true,
                      children: List.generate(list.length, (index) {
                          return Card(
                              shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(16)),
                              //clipBehavior: Clip.antiAlias,
                              color: Theme.of(context).cardColor,
                              child: Center(
                                  child: Text(
                                    list[index],
                                    style: Theme.of(context).textTheme.bodyText1,
                                  )));
                        },
                      )),
                );
              })
        ],
      ),
    );
  }```

CodePudding user response:

So, after long research I discovered that the 'horizontal scrolling' is working just fine on mobile, the problem was because I used chrome. You can refer to [Horizontal listview not scrolling on web but scrolling on mobile] for more information.

CodePudding user response:

Try wrapping your ListView/GridView with a Flexible Widget. Also Youve set physics to NeverScrollableScrollPhysics() so change it to some other scroll physics(like AlwaysScrollableScrollPhysics()) if you want it to be scrollable

  • Related