From 23cf8b9de81cade9ce90b8401c39432bc70f9d0d Mon Sep 17 00:00:00 2001
From: Lukas Klingsbo <me@lukas.fyi>
Date: Thu, 1 Feb 2024 11:22:33 +0100
Subject: [PATCH] fix: Properly update sprites in SpriteButtonComponent (#3013)

Previously if you replaced a sprite in a `SpriteButtonComponent` with
`component.button = ...` it didn't update the button visually since the
`sprites` map wasn't updated, this PR solves that.
---
 .../input/sprite_button_component.dart        | 39 +++++++++++++------
 .../input/sprite_button_component_test.dart   | 34 ++++++++++++++++
 2 files changed, 61 insertions(+), 12 deletions(-)

diff --git a/packages/flame/lib/src/components/input/sprite_button_component.dart b/packages/flame/lib/src/components/input/sprite_button_component.dart
index bd3d3a4b66..dfbb7076fd 100644
--- a/packages/flame/lib/src/components/input/sprite_button_component.dart
+++ b/packages/flame/lib/src/components/input/sprite_button_component.dart
@@ -18,15 +18,9 @@ enum ButtonState {
 /// through the constructor.
 class SpriteButtonComponent extends SpriteGroupComponent<ButtonState>
     with TapCallbacks {
-  /// Callback for what should happen when the button is pressed.
-  void Function()? onPressed;
-
-  Sprite? button;
-  Sprite? buttonDown;
-
   SpriteButtonComponent({
-    this.button,
-    this.buttonDown,
+    Sprite? button,
+    Sprite? buttonDown,
     this.onPressed,
     super.position,
     Vector2? size,
@@ -35,20 +29,41 @@ class SpriteButtonComponent extends SpriteGroupComponent<ButtonState>
     super.anchor,
     super.children,
     super.priority,
-  }) : super(
+  })  : _button = button,
+        _buttonDown = buttonDown,
+        super(
           current: ButtonState.up,
           size: size ?? button?.originalSize,
         );
 
+  /// Callback for what should happen when the button is pressed.
+  void Function()? onPressed;
+
+  Sprite? _button;
+  Sprite? _buttonDown;
+
+  Sprite get button => _button!;
+  Sprite get buttonDown => _buttonDown ?? button;
+
+  set button(Sprite value) {
+    _button = value;
+    sprites?[ButtonState.up] = value;
+  }
+
+  set buttonDown(Sprite value) {
+    _buttonDown = value;
+    sprites?[ButtonState.down] = value;
+  }
+
   @override
   void onMount() {
     assert(
-      button != null,
+      _button != null,
       'The button sprite has to be set either in onLoad or in the constructor',
     );
     sprites = {
-      ButtonState.up: button!,
-      ButtonState.down: buttonDown ?? button!,
+      ButtonState.up: button,
+      ButtonState.down: buttonDown,
     };
     super.onMount();
   }
diff --git a/packages/flame/test/components/input/sprite_button_component_test.dart b/packages/flame/test/components/input/sprite_button_component_test.dart
index 134279a4a7..b9a6f4f3bc 100644
--- a/packages/flame/test/components/input/sprite_button_component_test.dart
+++ b/packages/flame/test/components/input/sprite_button_component_test.dart
@@ -194,6 +194,40 @@ Future<void> main() async {
       },
     );
   });
+
+  testWithFlameGame('can change button sprites', (game) async {
+    final buttonSheet = SpriteSheet.fromColumnsAndRows(
+      image: image,
+      columns: 1,
+      rows: 2,
+    );
+
+    final button = SpriteButtonComponent(
+      button: buttonSheet.getSpriteById(0),
+      buttonDown: buttonSheet.getSpriteById(1),
+    );
+
+    await game.ensureAdd(button);
+
+    expect(
+      button.sprites,
+      {
+        ButtonState.up: buttonSheet.getSpriteById(0),
+        ButtonState.down: buttonSheet.getSpriteById(1),
+      },
+    );
+
+    button.button = buttonSheet.getSpriteById(1);
+    button.buttonDown = buttonSheet.getSpriteById(0);
+
+    expect(
+      button.sprites,
+      {
+        ButtonState.up: buttonSheet.getSpriteById(1),
+        ButtonState.down: buttonSheet.getSpriteById(0),
+      },
+    );
+  });
 }
 
 class SimpleStatelessWidget extends StatelessWidget {