All I need is my text to be multi-line. Am giving the property of maxLines
but its still getting RenderFlex
overflowed error to the right as the next i
try this:
Expanded(
child: Text(
'a long text',
overflow: TextOverflow.clip,
),
),
in my implementation I put this inside a row and surrounded it with sized boxes on each side so that I have some space between my elements, why using expanded you may ask, well it's used to take as much space as possible so the text would look good in portrait or landscape mode.
and here is a full example on how to make it even react vertically not just horizontally:
Card(
child: InkWell(
onTap: (){},
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
SizedBox(
height: 70, // default\minimum height
),
Container(
height: 44,
width: 44,
decoration: BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.all(Radius.circular(22))),
),
SizedBox(
width: 15,
),
Expanded(
child: Text(
'the very long title',
overflow: TextOverflow.clip,
),
),
SizedBox(
width: 10,
),
Text(
'value', //some other text in the end of the card or maybe an icon instead
),
SizedBox(
width: 30,
),
],
),
),
),
)