如何获得两个并排的Text窗口小部件,以仅允许最左边的一个窗口小部件正常溢出?
列中的一个文本小部件很容易优雅地溢出。并排放置两个文本小部件是有问题的。
堆栈溢出需要更多详细信息,但老实说,我现在可能会浪费您更多的时间。
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); }
您可以使用Flexible小部件:
Flexible
Widget _listItemSubtitle(String subtitle) { return new Flexible( fit: FlexFit.loose, child: Text( "[$subtitle]", softWrap: false, overflow: TextOverflow.fade, ), ); }
替代方案:
如果您希望时间窗口小部件始终位于右侧,则可以将字幕文本包装在Expanded窗口小部件中:
Expanded
Widget _listItemSubtitle(String subtitle){ return Expanded( child: Text( "[$subtitle]", softWrap: false, overflow: TextOverflow.fade, ), ); }