Dynamically spread text to multiple lines according to their length in flutter
203
Wrap the Column
with an Expanded
widget
Container(
alignment: Alignment.center,
width: double.infinity,
height: 100.0,
child: Row(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: ClipOval(
child: Image.asset(
'assets/images/c1.png',
fit: BoxFit.cover,
width: 69,
height: 69,
),
),
),
Expanded(
child: Column(
children: [
const Text(
'@username',
style: TextStyle(color: Colors.white),
),
Expanded(
child: const Text(
'fwegergwefrvgervuhygtfvrcdxddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddne, a very long comment!!!',
textAlign: TextAlign.justify,
maxLines: 6,
overflow: TextOverflow.ellipsis,
)),
],
),
),
],
),
)
Author by
Aryan Shandilya
Updated on December 07, 2022Comments
-
Aryan Shandilya over 1 year
So, I am building this app in flutter where users can comment in upto 150 characters and when I am trying to display it there's this render overflow error because of the length of the string. So, how can I spread the text to multiple lines based on their length and display them accordingly. There's a similar question here but that does not solve my problem. Can I get some help?
Container( alignment: Alignment.center, width: double.infinity, height: 100.0, child: Row( children: [ Padding( padding: const EdgeInsets.all(8.0), child: ClipOval( child: Image.asset( 'assets/images/c1.png', fit: BoxFit.cover, width: 69, height: 69, ), ), ), Column( // mainAxisAlignment: MainAxisAlignment.center, children: [ const Text( '@username', style: TextStyle(color: Colors.white), ), Expanded(child: const Text('fwegergwefrvgervuhygtfvrcdxddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddne, a very long comment!!!', textAlign: TextAlign.justify, maxLines: 6, overflow: TextOverflow.ellipsis,)), ], ), ], ), ),