Row inside a Column with Expanded (AutosizeText not resizing) - flutter

Question

I have a AutosizeText widget wrapped in a column and a row. It doesn't resize, it overflows and when I wrap the AutosizeText into an expanded widget it (as suggested by the AutosizeText package) there's an Error: RenderBox was not laid out: RenderFlex#2f4c1 relayoutBoundary=up1 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
Here is a minimal reproducible sample:
class Example extends StatelessWidget {
const Example({
Key? key,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return Row(
children: [
Column(
children: [
Row(
children: const [
AutoSizeText('subject',
maxLines: 1,
minFontSize: 16,
overflowReplacement: Text(
'subject',
)),
],
),
],
),
],
);
}
}
Here's the widgetTree of the App.

Answer 1

The problem here is because of the first Row Widget as they said:
When a row is in a parent that does not provide a finite width constraint it will try to shrink-wrap its children along the horizontal axis
so here the Row Widget is trying to shrink its child AutoSizeText and here will be a second problem that if the text is bigger than the screen size it will overflow.
the solution here is to expand the AutoSizeText, but here will be another problem, as they said:
Setting a flex on a child (e.g. using Expanded) indicates that the child is to expand to fill the remaining space in the horizontal direction
These two directives are mutually exclusive. If a parent is to shrink-wrap its child, the child cannot simultaneously expand to fit its parent
as you can see the Row Widget is trying to shrink its child, at the same time the Expanded Widget is trying to expand it, so they will conflict with each other and that causes your problem.
The safe solution here is to wrap 'AutoSizeText' with Expanded and as my dear friend #Dulaj Nadawa said: is to wrap The Column Widget with Expanded too
and for sure avoid using unnecessary Widgets
.
hope I could help.

Answer 2

try this:
Row(
children: [
Expanded(
child: Column(
children: [
Expanded(
child: Row(
children: [
Expanded(
child: AutoSizeText(
'The text to display sdasdasdadsd das dasd as da das da s as dasd ad as da s dads asdas das dsd s',
maxLines: 1,
minFontSize: 16,
overflowReplacement: Text(
'subject',
)),
),
Container(
height: 100,
width: 100,
color: Colors.red,
),
],
),
),
Container(
height: 100,
width: 100,
color: Colors.purple,
),
],
),
),
],
)

Answer 3

Try wrapping both Column and AutosizeText with Expanded