[Flutter] Using min width with FractionallySizedBox

I need a container that has a width of 40% of the screen width and consists of 2 equal columns.

I tried to do it like this:

class MyWidget extends StatelessWidget {
const MyWidget({super.key});

@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
constraints: const BoxConstraints(minHeight: 300, minWidth: 450),
color: Colors.green,
child: FractionallySizedBox(
widthFactor: 0.4,
child: AspectRatio(
aspectRatio: 1.5,
child: Row(
children: [
Expanded(
child: Container(
color: Colors.red,
child: const Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [Text('1'), Text('2'), Text('3')],
),
),
),
Expanded(
child: Container(
color: Colors.blue,
child: const Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [Text('1'), Text('2'), Text('3')],
),
),
),
],
),
),
),
),
),
);
}
}


And the main container behaves as expected, but the columns keep shrinking to 40% of the screen width.

It's okay as long as the width is big enough

But when the container can't get any smaller, this happens

How can I avoid this and make the width of these columns depend solely on the width of the container?

Continue reading...