i am trying to make the home screen scrollable with SingleChildScrollView but reading other questions on Stackoverflow, it seems that Expanded causes problems. I am new to Flutter, so i am here to ask you if you know how could i fix this. I noticed that if i wrap the Column in a SingleChildScrollView widget it works without the Expanded widget, so that's the problem for sure. Do you know how could i replace the Expanded widget? I don't know what height it is going to have, since i am probably going to add more buttons.
Here there is the code:
return Scaffold(
body: Stack(
children: [
Container(
margin: EdgeInsets.symmetric(horizontal: size.width * 0.10),
child: Column(children: [
SizedBox(height: statusBarHeight), // spazio per statusbar
Align(
alignment: Alignment.topLeft,
child: Container(
margin: EdgeInsets.only(top: size.height * 0.04),
height: 20,
// color: Colors.orange,
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Icon(Icons.wb_sunny_sharp, size: 20, color: Color(0xff8276f4)),
SizedBox(width: 8), // Spazio laterale da icona
Text("MER 18 AGO", style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18,
color: Color(0xff8276f4),
),),
],)
),
),
Container(
margin: EdgeInsets.only(top: 15, bottom: 20),
width: size.width * 0.80,
decoration: BoxDecoration(
// color: Color(0xffaf8eff),
borderRadius: BorderRadius.circular(29.5)
),
child: Text("Ciao, Andrea!", style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 30,
color: Color(0xff2e3760),
),),
alignment: Alignment.centerLeft,
),
Container(
height: size.height * 0.30,
width: size.width * 0.80,
decoration: BoxDecoration(
color: Color(0xffdee0e3),
image: DecorationImage(
scale: 0.5,
image: AssetImage('assets/images/standing.png')
),
borderRadius: BorderRadius.circular(29.5)
),
),
SizedBox(height: 20),
Align(
alignment: Alignment.topLeft,
child: Container(
child: Text("Cosa vuoi fare oggi?", style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 20,
color: Color(0xff2e3760),
),),
),
),
Expanded(
child: Container(
// color: Colors.orange,
margin: EdgeInsets.only(top: 20),
child: GridView.count(
padding: EdgeInsets.all(0),
childAspectRatio: 0.8,
crossAxisSpacing: 20,
mainAxisSpacing: 20,
children: <Widget>[
CategoryCard(
title: "Profilo",
numeroicona: 60307,
numerocolore: 0xFF8c7ffd,
),
CategoryCard(
title: "Università",
numeroicona: 58713,
numerocolore: 0xffb08dff,
),
CategoryCard(
title: "Idee",
numeroicona: 58235,
numerocolore: 0xFF1a88ff,
),
CategoryCard(
title: "Progetti",
numeroicona: 61080,
numerocolore: 0xFF4b5982,
),
],
crossAxisCount: 2),
),
),
],),
),
Now it will scroll like this
I used SliverToBoxAdapter
on Column
, then replaced GridView
with SliverGrid.count
. I'm making pr to the repo. After checking, let me know this is what you wanted?