Flutter：Timer激活运行时如何避免Text组件出现重新居中偏移问题

你遇到的文本偏移是因为默认字体的数字字宽不统一，即便外层用Expanded固定了父容器宽度，不同数字组成的时间字符串总宽度会发生变化，冒号和整体文本的视觉位置就会出现偏移，你之前只包Expanded没有解决字宽不统一的核心问题，所以无效。

下面按优先级从高到低给出可行方案：

• 方案1：启用字体的等宽数字特性（最优，无需修改布局/引入额外资源）
  直接在Text的style中添加fontFeatures属性，开启表格数字特性，所有数字会自动使用相同宽度展示，时间字符串总宽度永远固定，完全消除偏移：

  Text(
    "${f.format(_minutes)}:${f.format(_seconds)}",
    textAlign: TextAlign.center,
    style: TextStyle(
      fontSize: 80,
      color: Color(0xff7165E3),
      // 新增以下配置即可
      fontFeatures: [FontFeature.tabularFigures()],
    ),
  )
  

• 方案2：使用等宽字体
  如果方案1对你的当前字体不生效，可以给Text指定等宽字体，所有字符宽度统一：
  1. 先在pubspec.yaml中引入等宽字体（比如RobotoMono）
  2. 给Text的style添加字体配置：

  style: TextStyle(
    fontSize: 80,
    color: Color(0xff7165E3),
    fontFamily: 'RobotoMono',
  )
  

• 方案3：固定Text外层宽度（兜底方案）
  如果不想调整字体，直接给Text套固定宽度的SizedBox，宽度设为你当前字体下最大宽度的时间文本（比如00:00）所需的宽度即可：

  SizedBox(
    // 可根据你的字体大小微调数值
    width: 280,
    child: Text(
      "${f.format(_minutes)}:${f.format(_seconds)}",
      textAlign: TextAlign.center,
      style: TextStyle(
        fontSize: 80,
        color: Color(0xff7165E3),
      ),
    ),
  )
  

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