fix: SpriteAnimationWidget can now be update animation safely (#1738)

* Replace SingleTickerProviderStateMixin to TickerProviderStateMixin

* Adding failing test

* Re-use the animation controller

* Add some tests

* Remove redundant removing listener

Co-authored-by: Erick <erickzanardoo@gmail.com>

packages/flame/lib/src/widgets/animation_widget.dart

@@ -105,7 +105,6 @@ class _InternalSpriteAnimationWidgetState
  @override
  void initState() {
  super.initState();
- widget.animation.onComplete = _pauseAnimation;
  _setupController();
  if (widget.playing) {
  _initAnimation();
@@ -140,17 +139,18 @@ class _InternalSpriteAnimationWidgetState
  }
 
  void _setupController() {
- _controller?.dispose();
+ widget.animation.onComplete = _pauseAnimation;
+ _controller ??= AnimationController(vsync: this)
+ ..addListener(_onAnimationValueChanged);
+ }
 
- _controller = AnimationController(vsync: this)
- ..addListener(() {
- final now = DateTime.now().millisecond.toDouble();
+ void _onAnimationValueChanged() {
+ final now = DateTime.now().millisecond.toDouble();
 
-  final dt = max(0, (now - (_lastUpdated ?? 0)) / 1000).toDouble();
-  widget.animation.update(dt);
+ final dt = max(0, (now - (_lastUpdated ?? 0)) / 1000).toDouble();
+ widget.animation.update(dt);
 
- setState(() => _lastUpdated = now);
- });
+ setState(() => _lastUpdated = now);
  }
 
  void _pauseAnimation() {

packages/flame/test/widgets/sprite_animation_widget_test.dart

@@ -66,5 +66,31 @@ Future<void> main() async {
  expect(spriteAnimationWidgetFinder, findsOneWidget);
  },
  );
+
+ testWidgets('can safely change animation parameter', (tester) async {
+ final frames = List.generate(5, (_) => Sprite(image));
+ final animation1 = SpriteAnimation.spriteList(frames, stepTime: 0.1);
+ final animation2 = SpriteAnimation.spriteList(frames, stepTime: 0.1);
+
+ await tester.pumpWidget(SpriteAnimationWidget(animation: animation1));
+ expect(animation1.onComplete, isNotNull);
+ expect(animation2.onComplete, isNull);
+
+ await tester.pump();
+ expect(animation1.elapsed, isNonZero);
+ expect(animation2.elapsed, isZero);
+
+ // This will call didUpdateWidget life cycle
+ await tester.pumpWidget(SpriteAnimationWidget(animation: animation2));
+ expect(animation1.onComplete, isNull);
+ expect(animation2.onComplete, isNotNull);
+
+ // Reset the replaced animation for clarifying the expectation
+ animation1.reset();
+
+ await tester.pump();
+ expect(animation1.elapsed, isZero);
+ expect(animation2.elapsed, isNonZero);
+ });
  });
 }