'Remove the spaces between Gridview in Flutter

I want to remove the spaces between gridview children. I will provide an image of what I need and what below respectively. I used the GridView() by the way.

 GridView(
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3, ),
            children: <Widget>[
                ...sections
            ],
          ),

sections is a list of widgets.

what I want

What I am getting

apologise, I am unable to show images my questions yet.



Solution 1:[1]

I used GridView.count a lot within my apps. You can just remove the bottom padding of a GridView using padding: EdgeInsets.zero.

Solution 2:[2]

Your children probably have margin.

See this.

       GridView(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 3,
            mainAxisSpacing: 1,
            crossAxisSpacing: 1,
          ),
          children: List.generate(
            20,
            (index) => Container(
              color: Colors.white,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Icon(Icons.touch_app, size: 30, color: Colors.yellow[900],),
                  SizedBox(height: 10,),
                  Text("Touch", style: TextStyle(fontSize: 20),)
                ],
              ),
            ),
          ),
        ),

The output:

enter image description here

Solution 3:[3]

gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
    maxCrossAxisExtent: 200.0,
    mainAxisSpacing: 10.0,
    crossAxisSpacing: 10.0,
    childAspectRatio: 4.0,
  ),

Try with altering the values. I think this will help you.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Alann Maulana
Solution 2 Josteve
Solution 3 Nazmul81