如何将Flutter Text组件改为Extended Text实现中间省略效果？

直接替换你原来的Text组件为以下ExtendedText代码，即可实现文本溢出时在中间显示省略号：

ExtendedText(
  text,
  overflow: TextOverflow.ellipsis,
  style: style.copyWith(
    color: color,
    fontWeight: fontWeight,
    decoration: underlined ? TextDecoration.underline : null,
  ),
  overflowWidget: const OverflowWidget(
    position: TextOverflowPosition.middle,
    child: Text('...'),
  ),
)

关键参数说明 #

• 完全保留了你原有的样式配置，确保视觉效果和之前一致
• overflow: TextOverflow.ellipsis：触发组件的溢出处理逻辑
• overflowWidget是实现中间省略的核心：
  • position: TextOverflowPosition.middle：明确指定省略号显示在文本中间位置
  • child：传入省略号的展示组件，这里用默认的Text('...')即可，若需要自定义省略号样式，直接给这个Text添加style参数就行

前置要求 #

确保你的项目已经引入了extended_text依赖，在pubspec.yaml中添加后执行依赖拉取操作。

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