Flutter 如何为Row组件内的溢出文本正确添加省略号

• TextOverflow.ellipsis生效的前提是Text组件有明确的最大宽度约束，直接放在Row中的Text默认获取的是无界横向宽度，无法判断溢出边界，所以省略号不会显示
• 直接用Expanded包裹figure Text时，Expanded会强制占满Row的剩余横向空间，短文本场景下figure会撑开中间空白区域，把图标挤到左侧，不符合右侧对齐的预期
• 原有代码中的Spacer本质是一个占满剩余空间的Expanded，和直接包裹figure的Expanded会互相抢占横向空间，必然导致布局错位

调整Row的子组件层级结构，把右侧的图标、间距、文本统一封装到同一个Expanded中，既保证右侧元素组整体占满year文本后的剩余空间，又能让组内元素保持右对齐，同时给文本加上宽度约束触发省略号，具体调整如下：

• 移除原有独立的Spacer组件
• 将icon、间距SizedBox、figure文本统一放入一个外层Expanded组件内，占满year文本右侧的所有横向空间
• 在这个外层Expanded中嵌套子Row，设置子Row的对齐规则为MainAxisAlignment.end，保证短文本时图标和文本整体贴在Row最右侧，和原短文本展示效果完全一致
• 子Row内的figure文本用Flexible包裹，补充maxLines: 1属性：短文本时Text按内容实际宽度渲染，和图标保持固定间距；文本长度增加时自动填充中间空白、带动图标左移；长文本溢出时自动显示省略号，不会挤压图标位置

修复后的完整代码如下：

Column(
  children: [
    Row(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Text(
          year,
          style: Theme.of(context).textTheme.subtitle2,
        ),
        Expanded(
          child: Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              icon,
              const SizedBox(width: 0.1),
              Flexible(
                child: Text(
                  figure,
                  style: Theme.of(context).textTheme.subtitle2,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                ),
              ),
            ],
          ),
        ),
      ],
    ),
    Divider(
      height: 5,
      thickness: 0.7,
      color: Theme.of(context).dividerColor,
    ),
  ],
);

内容的提问来源于stack exchange，提问作者Me too