如何让两个并排的文本小部件只允许最左边的小部件优雅地溢出?
列中的一个文本小部件很容易优雅地溢出。两个文本小部件并排在一行中是有问题的。
堆栈溢出需要更多的细节,但老实说,我可能只是浪费你更多的时间在这一点上。
Widget _listItem({String title, String subtitle}){
return Row(
children: <Widget>[
_listItemIcon(),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
_listItemTitle(title),
Row(
children: <Widget>[
_listItemSubtitle(subtitle), // how do I allow this to overflow gracefully
_listItemTime("2m") // but stop this from overflowing
],
)
],
),
),
_listItemFavorite()
],
);
}
//////////////
Widget _listItemIcon(){
return Icon(Icons.message);
}
Widget _listItemTitle(String title){
return Text(
title,
softWrap: false,
overflow: TextOverflow.fade,
style: TextStyle(
fontSize:24.0
),
);
}
Widget _listItemSubtitle(String subtitle){
return Text(
"[$subtitle]",
softWrap: false,
overflow: TextOverflow.fade,
);
}
Widget _listItemTime(String time){
return Text(
"[$time]",
softWrap: false,
overflow: TextOverflow.fade,
);
}
Widget _listItemFavorite(){
return Icon(Icons.favorite);
}
2条答案
按热度按时间pkln4tw61#
您可以使用
Flexible
小部件:备选方案:
如果您希望时间部件始终位于右侧,则可以将字幕文本 Package 在
Expanded
部件中:7cjasjjr2#
有时我们在Row中有很多不同的小部件,在这种情况下,我们可以使用这种方法