SizeEffect on PolygonComponent

[mel-mouk]

Hi, I came across an issue while playing around with built-in effect for a small game.

Current bug behaviour

When I use SizeEffect.to the actual effect is a move, not a resize. I had a look at the source code and tried to override it to make some test. The code is actually updating the size and the component's properties does not show anything weird so I don't really get what's going on

Expected behaviour

Expected behaviour would be a resize of the component

Steps to reproduce

Create a simple Game object, add a Rectangle of some size. On tap, add a SizeEffect. Minimalist source code to reproduce below :

class SimpleGame extends FlameGame with TapDetector {
  late Vector2 canvasSize;
  late RectangleComponent testSquare;
  @override
  void onGameResize(Vector2 size) {
    super.onGameResize(size);
    canvasSize = size;
  }

  @override
  Future<void> onLoad() async {
    testSquare = RectangleComponent(
        position: canvasSize / 2,
        size: canvasSize / 2,
        paint: BasicPalette.blue.paint(),
        anchor: Anchor.center
    );
    add(testSquare);
    await super.onLoad();
  }

  @override
  bool onTapDown(TapDownInfo event) {
    testSquare.add(SizeEffect.to(Vector2(10, 10), EffectController(duration: 1)));
    return true;
  }
}

main() {
  final game = SimpleGame();

  runApp(
    GameWidget(
      game: game,
    ),
  );
}

Flutter doctor output

Flutter (Channel stable, 2.8.1, on macOS 12.2 21D49 darwin-x64, locale en-FR)
    • Flutter version 2.8.1 at /Applications/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 77d935af4d (4 months ago), 2021-12-16 08:37:33 -0800
    • Engine revision 890a5fca2e
    • Dart version 2.15.1
(...)
[✓] Xcode - develop for iOS and macOS (Xcode 13.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.10.1

[✓] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)

More environment information

• Flame version: 1.1.0
• Platform affected: ios

If needed I would be happy to work on the subject but I'm currently stuck about what to look for as the current code looks good and I can't find anything weird in my logs

[ufrshubham]

@mel-mouk I am not 100% sure but I think the problem is with PolygonComponent class. If I replace the RectangleComponent (extends PolygonComponent) with a CircleComponent (does not extend PolygonComponent) in your example, it does result is correct output. Also, if you turn on the debugMode in your example, you'll notice that the bounding box of the rectangle component is actually shrinking correctly. Just to verify my theory, I also tested it with a SpriteComponent, and that too worked perfectly fine.

[spydon]

Good catch @ufrshubham, the vertices in the Polygon aren't bound to the Size after the polygon has been created. I think that you want to use a ScaleEffect anyways @mel-mouk.

[mel-mouk]

Thanks for looking into it. Definitely make sense, I'll see if I am able to propose a fix. In the meantime, yes, I replaced it in my application with a ScaleEffect. It works fine for my purpose but I wanted to inform you anyway