如何让两个并排的文本小部件只允许最左边的一个优雅地溢出?

一列中的一个文本小部件很容易优雅地溢出. 两个文本小部件并排在一行是有问题的.

Stack overflow需要更多细节,但老实说,我现在可能只是在浪费你更多的时间.

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);
}

enter image description here

推荐答案

您可以使用Flexible小部件:

Widget _listItemSubtitle(String subtitle) {
  return new Flexible(
    fit: FlexFit.loose,
    child: Text(
      "[$subtitle]",
      softWrap: false,
      overflow: TextOverflow.fade,
    ),
  );
}

result


替代方案:

如果您希望时间小工具始终位于右侧,则可以将字幕文本换行到Expanded个小工具中:

Widget _listItemSubtitle(String subtitle){
  return Expanded(
    child: Text(
      "[$subtitle]",
      softWrap: false,
      overflow: TextOverflow.fade,
    ),
  );
}

result

Dart相关问答推荐

播放和暂停 Flutter 动画

默认情况下不可为空(Non-nullable ):如何启用experiment?

日期时间时区反序列化

Flutter 中带有导航栏的永久视图

Flutter.io (dart) - 如何创建左填充覆盖?

如何使用 Android aar 文件构建 Flutter 项目?

在 Dart 中定义一个接受参数的 getter

将 Flutter 前端与 Android 和 iOS 的 .NET Core 后端相结合

如何签署 Flutter 的应用程序

无法导入 dart 的 intl 包

在 Dart 中使用带有 Future 的循环

iOS 上 Flutter 的代码设计错误

如何在 Flutter 中使用 Provider 显示来自 ChangeNotifier 的错误

Dart-对base64字符串进行编码和解码

如何使用flatter删除Firestore文档中的字段

如何将 转换为 List

全局减慢 Flutter 中的动画

Dart 有小部件库吗?

一个集合如何确定两个对象在dart中相等?

有没有办法在 Dart 中通过引用传递原始参数?