Flutter - How to add two Text Widgets in a Column with the 2nd one overflowing vertically after filling the spaces horizontally?

Question

I made a Chat app, I made two Text widgets inside a Column widget, now I want to make the Chat message (the 2nd text Widget) Text Widget to go Vertically after filling the spaces horizontally, so what can I do, this is the image of the Chat screen and What happens is this(image), the images are embedded because I'm a new user

The Code of it is this:-

 Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[

          /// USER NAME
          Text(userName, style: Theme.of(context).textTheme.subtitle),


          /// CHAT MESSAGE
          Container(
            margin: const EdgeInsets.only(top: 5.0),
            child: Text(
              theText,
              maxLines: null,
              style: Theme.of(context).textTheme.body2,
            ),
          ),
        ],
      ),

I expected the Code to work like the traditional Chat app's messages, the First text widget (USERNAME) worked but the 2nd one (the actual CHAT MESSAGE) didn't work as it Overflows by pixels, So how can I fix this and Make it like the traditional Chat Messages??

Answer 1

I resolved the problem! And here it is:

I just wrapped my whole Column widget with a Flexible widget and it resolved my problem and now I can add Multiline Messages!

I'm keeping the post as to any Newbie facing the same problem 'may' find this useful...