I want to show the Divider when the text will end. It will close on the 1st line, 2nd line or 3rd line. After that the Divider will show the remaning space. I want to achieve the above image UI.
Row(
children: <Widget>[
Flexible(
flex: 1 /*or any integer value above 0 (optional)*/,
child: Padding(
padding: const EdgeInsets.only(left: 8.0, right: 8),
child: Row(
children: <Widget>[
list[index].event!.name!.length > 40 ? Container(
width: MediaQuery.of(context).size.width /1.1,
color: Colors.transparent,
child: Text(
list[index].event!.name!,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: white,
),
),
) :
Expanded(
flex: 0 /*or any integer value above 0 (optional)*/,
child: Text( list[index].event!.name!,
style: const TextStyle(
color: white,
overflow: TextOverflow.ellipsis,
),
)),
Expanded(child:Divider(color: appTextColor.withOpacity(0.2)))
],
),
),
),
如何实现此行为(虚线应为分隔符):
短文本
LOOOOOUOONG文本
Tooooooooooooooooooo
Long Text ----------------- // <- Divider should be here then