I have this code that I want the green container expanded to the full width of the ElevatedButton to make something like a bar on the button:
Card(
elevation: 20,
shadowColor: Colors.green,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(15),
),
),
child: ElevatedButton(
style: ButtonStyle(
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(15),
),
),
),
shadowColor: MaterialStateProperty.all(Colors.green),
backgroundColor: MaterialStateProperty.all(Colors.red),
),
onPressed: () {
Navigator.push(
c,
MaterialPageRoute(builder: (c) => route),
);
},
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
ClipRRect(
borderRadius: BorderRadius.only(topRight: Radius.circular(15), topLeft: Radius.circular(15)),
child: Container(
height: 45,
color: Color.fromARGB(255, 0, 176, 44),
child: Image.asset(
"assets/icons/${icon}",
),
),
),
Text(
label,
style: const TextStyle(color: Colors.black),
),
],
),
),
)
But what I'm getting is this instead:
,
I already tried Expanded, CrossAxisAligment.Stretch on the column, but it feels like the Button itself add some constraints to its children!