how to make a gridview whose items can change index

Question

I want to make certain grid items disappear. I use the Visibility widget but in the gridview the item does not disappear from the grid list, what should I do?

GridView.count(
 shrinkWrap: true,
 crossAxisCount: 2,
 mainAxisSpacing: 7.5,
 crossAxisSpacing: 7.5,
 physics: NeverScrollableScrollPhysics(),
 children: [
   Visibility(
     visible: false,
     child: Container(
       color: Colors.green,
       child: Center(
         child: Text('1'),
       ),
     ),
   ),

   Visibility(
     visible: true,
     child: Container(
       color: Colors.green,
       child: Center(
         child: Text('2'),
       ),
     ),
   ),

   Visibility(
     visible: true,
     child: Container(
       color: Colors.green,
       child: Center(
         child: Text('3'),
       ),
     ),
   ),
 ],
)

what I get

what I want

user_10157127 · Answer

Visibility is used to show or hide a child.

If you want to remove physical space, use if statement

if (false)
  Container(
    color: Colors.green,
    child: Center(
      child: Text('1'),
    ),
  ),

You can also use else state

if(visible) MyVisibleWidget()
else  MyEmptyWidget(),

For if else you can also choose replacement on Visibility widget. I am not using replacement in this case because it will eventually add a child in replace of visible: false, which is not what we want.

how to make a gridview whose items can change index

1 Answers