移動

2023-05-02

position を変更する

PositionComponentpositionを操作することで、コンポーネントを移動させることができます。 (アクションを使う方法もあります)

公式ドキュメント https://docs.flame-engine.org/latest/flame/components.html#positioncomponent
APIリファレンス https://pub.dev/documentation/flame/latest/components/PositionComponent-class.html

動かす

CircleComponent(参照)を動かしてみます。 今回は自動でずっと動くサンプルなので、毎フレーム呼び出される update メソッドを使います。

updateメソッドは FlameGameやその他のコンポーネントの親であるComponentで定義されています。
今回はCircleComponentを継承せずに使っているので、MoveGameクラスのupdateを使っています。

import 'package:flame/components.dart';
import 'package:flame/game.dart';

class MoveGame extends FlameGame {
  var _speed = 200.0;
  late final CircleComponent _circle;

  @override
  Future<void> onLoad() async {
    super.onLoad();

    _circle = CircleComponent(
      position: Vector2(size.x * 0.5, size.y * 0.5),
      radius: size.x * 0.1,
      anchor: Anchor.center,
    );
    await add(_circle);
  }

  @override
  void update(double dt) {
    super.update(dt);

    final x = _circle.position.x + _speed * dt;
    if (x < _circle.radius || x > size.x - _circle.radius) {
      _speed *= -1;
    }
    _circle.position.x = x.clamp(_circle.radius, size.x - _circle.radius);
  }
}

これで円が左右に往復し続けるようになりました。

© 2023 tnantoka