FLUTTER: How to remove the gridview cells background?
608
You can wrap the gridView
with a container
and then use the property color
in the container
to change the background color.
Container(
color : Colors.black,
child : GridView.count(
.....
),
)
),
Author by
luc
Updated on December 17, 2022Comments
-
luc over 1 year
I tried to put boxshadow to my containers inside a gridview but shadows are outside the cells and the background color of cells are different from the page background color. I want to have my containers in gridview with same backgroundcolor and clean boxshadow to my container. If I use it outside of gridview it works perfectly. This is my code:
Widget build(BuildContext context) { return Scaffold( backgroundColor: Theme.of(context).backgroundColor, body: Center( child: FutureBuilder( future: Firestore.instance.collection('rooms').document(pincode).get(), builder: (BuildContext context, AsyncSnapshot snapshot) { if (snapshot.hasData) { nomines = snapshot.data['Nominés']; thequestion = snapshot.data['Question'].toString(); return Column(children: <Widget>[ Text(thequestion), Expanded( child: StreamBuilder<QuerySnapshot>( stream: Firestore.instance .collection('rooms') .document(pincode) .collection('users') .snapshots(), builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) { if (!snapshot.hasData) return Text("Chargement...."); else { return new GridView.count( crossAxisCount: 2, children: snapshot.data.documents .map((DocumentSnapshot document) { if (document['id'] == nomines[0] || document['id'] == nomines[1]) return Container( child: InkWell( onTap: () { vote(document['id']).then((a) { Navigator.push( context, MaterialPageRoute( builder: (context) => Waitresults(), )); }); }, child: Container( decoration: BoxDecoration( border: Border.all( width: 2.0, color: Color(document['couleur'])), boxShadow: <BoxShadow>[ BoxShadow( color: Color(document['couleur']), blurRadius: 0, offset: Offset(7, 3)) ], shape: BoxShape.circle), child: OvalPic(document['photo'], document['couleur']), ), ), ); else return null; }).toList() ..removeWhere((el) => el == null)); } }, ), ) ]); } else return CircularProgressIndicator(); }, ), ), );
}