Flutter中TweenAnimationBuilder动画播放过快问题及解决方案

我之前也碰到过类似的动画节奏异常问题，看了你的代码后，很快定位到了问题根源：

问题本质 #

你的TimePiePainter类里的shouldRepaint方法始终返回true，这会导致CustomPaint在每一帧都强制触发重绘——哪怕动画的进度值（value）根本没有变化。这种不必要的频繁重绘会干扰TweenAnimationBuilder的正常动画调度逻辑，让系统误以为需要加速渲染，最终导致动画时长被大幅压缩，出现「5秒动画瞬间结束、5分钟动画仅10秒完成」的异常。

而且TweenAnimationBuilder本身就会在动画的每一帧自动触发builder回调，传递更新后的value，完全不需要shouldRepaint一直返回true来强制重绘。

修复方案 #

只需要修改shouldRepaint方法，让它只在新旧value发生变化时才返回true，避免无意义的重绘：

class TimePiePainter extends CustomPainter { 
  final double value; 
  TimePiePainter(this.value); 
  @override 
  void paint(Canvas canvas, Size size) { 
    Paint _paint = Paint() 
      ..color = Color.lerp(Colors.green, Colors.redAccent, value > 0.6 ? value * 1.5 : value)! 
      ..style = PaintingStyle.fill; 
    canvas.drawArc( 
      Rect.fromLTWH(0, 0, size.width, size.height), 
      -pi / 2, 
      pi * 2 - pi * 2 * value, 
      true, 
      _paint, 
    ); 
  } 
  @override 
  bool shouldRepaint(covariant TimePiePainter oldDelegate) { 
    // 仅当value变化时才触发重绘
    return oldDelegate.value != this.value; 
  } 
}

额外提示 #

注意到你写了getRadiansFromTotalTime方法，但当前代码里并没有调用它。如果这是你原本用来计算倒计时进度的逻辑，可以考虑把它整合到Tween的设置或者builder回调中，让动画逻辑更连贯清晰。

修改完成后，TweenAnimationBuilder就能严格按照你设置的Duration来正常播放动画了。

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