I have a problem in making cards with gridview and it isnt scrollable. Below is the code:
GridView.builder(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2, // number of items in each row
mainAxisSpacing: 8.0, // spacing between rows
crossAxisSpacing: 8.0, // spacing between columns
childAspectRatio: (0.5),
),
scrollDirection: Axis.vertical,
shrinkWrap: true,
padding: EdgeInsets.all(MediaQuery.of(context).size.width *
1 /
15), // padding around the grid
itemCount: CoffeeList.length,
itemBuilder: (context, index) {
Coffee cof = CoffeeList[index];
return Container(
height: 250,
child: Card(
margin: const EdgeInsets.all(4),
child: Column(children: <Widget>[
Center(
child: Stack(children: <Widget>[
Container(
width:
MediaQuery.of(context).size.width * 47 / 125,
height:
MediaQuery.of(context).size.width * 47 / 125,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(12),
image: DecorationImage(
image: AssetImage((cof.imageAsset)),
fit: BoxFit.fill)),
),
Container(
width: 60,
height: 30,
decoration: BoxDecoration(
color: Colors.black.withOpacity(0.20),
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(16),
bottomRight: Radius.circular(16))),
),
const Padding(
padding: EdgeInsets.symmetric(
vertical: 5, horizontal: 5),
child: Icon(
Icons.star_rounded,
color: Colors.yellow,
size: 20,
)),
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 28, vertical: 5),
child: Text(cof.star.toString(),
style: const TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight: FontWeight.w600)))
])),
Padding(
padding: EdgeInsets.symmetric(
vertical: 12, horizontal: 6),
child: Text(cof.type,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
)))
])));
},
),
Please ignore the large chunks of empty spaces as I wanted to deal with the overflow before adding more things.
I’ve tried using physics (NeverScrollableScrollPhysics) in GridView.builder and SingleChildScrollView yet nothing works
>Solution :
Wrap it with widgets like Flexible or Expanded if you put GridView inside Column or Row. If it is not then please share full widget tree, which covers this GridView