ElevatedButton does not accept restrictions of SizedBox - flutter

Question

Widget build(BuildContext context) {
var appBar = AppBar();
return Scaffold(
body:
Row(
children: [
Container(
color: Colors.green,
width: 800,
child: SizedBox(
width: 50,
child: ElevatedButton(child: Text("sdf"), onPressed: () {},),
)
),
Container(
child: Text("Hello"),
)
],)
);
}
I expected that size of button will be equal of SizedBox size

Answer 1

I can highly recommend taking a look at this official documentation about constraints: https://flutter.dev/docs/development/ui/layout/constraints
In your case, you have a Row which practically imposes infinite width. The Container as a direct child of your Row can set it's width to whatever you want but the Container will still pass down infinite width (as constraints) from the parent. Therefore you need to tell Flutter at this point, that you want to avoid this implicit given constraint - one working solution would be:
#override
Widget build(BuildContext context) {
return Scaffold(
body: Row(
children: [
Container(
color: Colors.green,
width: 300.0,
child: UnconstrainedBox(
alignment: Alignment.centerLeft,
child: SizedBox(
width: 100.0,
child: ElevatedButton(
onPressed: () {},
child: Text('LOL'),
),
),
),
),
Text('WTF')
],
),
);
}