前言

继续前面的内容，本文主要记录基于Flame实现飞机大战的敌机创建及生成器的基本内容。

笔者将这一系列文章收录到以下专栏，欢迎有兴趣的同学阅读：

基于Flutter&Flame 的飞机大战开发笔记

敌机构建

创建类Enemy1继承SpriteAnimationComponent，和之前的Player类一样，只是这个是代表敌机的Component。

class Enemy1 extends SpriteAnimationComponent {
  Enemy1({required Vector2 initPosition, required Vector2 size})
      : super(position: initPosition, size: size);

  @override
  Future<void> onLoad() async {
    List<Sprite> sprites = [];
    sprites.add(await Sprite.load('enemy/enemy1.png'));
    final spriteAnimation = SpriteAnimation.spriteList(sprites, stepTime: 0.15, loop: false);
    animation = spriteAnimation;

    add(RectangleHitbox()..debugMode = true);
  }

ps：这里继续使用SpriteAnimationComponent，只不过只有一帧。最后我们在Game层的onLoad添加一个敌机Component，先假定敌机的位置在(50,50)，大小为50 * 50。当然这里还有前文的Player。

// class Game
@override
Future<void> onLoad() async {
  final ParallaxComponent parallax = await loadParallaxComponent(
      [ParallaxImageData('background.png')]);
  add(parallax);

  final player = Player(
      initPosition: Vector2(size.x / 2, size.y * 0.75),
      size: Vector2(75, 100));
  add(player);

  final enemy = Enemy1(initPosition: Vector2(50, 50), size: Vector2(50, 50));
  add(enemy);
}

自动移动

飞机大战中敌机会自动从屏幕上方移动到屏幕下方直至移出界面。这里先简单利用Flame的屏幕刷新来更新敌机Component的position。

// class Enemy1
@override
void update(double dt) {
  super.update(dt);
  Vector2 ds = Vector2(0, 1) * 100 * dt;
  position.add(ds);
  if (position.y > gameRef.size.y) {
    removeFromParent();
  }
}

每个Component都有一个update回调，如果打印回调的dt可以发现，基本在16.66s左右，即1s会回调60次左右。这样符合刷新率60fps。依赖这个就可以计算出每一帧敌机位移的距离，继而更新position。

计算位移：这里运用小学的知识：s = v * t。即速度乘以时间，速度这里先简单定义100。由于是带方向的位移这里还需要转换成Vector2类型，Vector2(0, 1)表示向y轴正方向移动。ps：Flame中坐标系y轴向下，所以往下为正方向，这个跟移动端界面的坐标类似。
边界问题：若位移后position已超过可显示范围，视为移出屏幕，此时需要将敌机Component从父Component中移除。这里利用gameRef获取到最上层的Game对象，它的size即为游戏可显示范围。

自动生成器

实际场景中，敌机应该是随机在屏幕上方生成，然后再进行自动移动的。所以这里就需要一个生成器（亦或者是管理器，因为也不止一个种类的敌机）。

所以这里需要新建一个Component专门用作生成器。

class EnemyCreator extends PositionComponent with HasGameRef {
  late Timer _createTimer;
  final Random _random = Random();

  @override
  Future<void> onLoad() async {
    _createTimer = Timer(1, onTick: _createEnemy, repeat: true);
  }

  @override
  void onMount() {
    super.onMount();
    _createTimer.start();
  }

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

  @override
  void onRemove() {
    super.onRemove();
    _createTimer.stop();
  }

  void _createEnemy() {
    final width = gameRef.size.x;
    double x = _random.nextDouble() * width;
    final Vector2 size = Vector2(50, 50);
    if (width - x < 50) {
      x = width - 50;
    }
    final enemy1 = Enemy1(initPosition: Vector2(x, -size.y), size: size);
    add(enemy1);
  }
}

创建类EnemyCreator用于敌机生成

继承自PositionComponent。其实上述的SpriteAnimationComponent也是继承于它。默认的position为(0,0)，size为0 * 0。所以可以理解为这是一个不在Component树中绘制出来的Component。
利用Timer定时创建敌机，定时为1s。定时触发方法_createEnemy。从代码可以看出Timer也是依赖于update回调的。ps：onMount为Component被挂载到Component树的时机，反之onRemove就是被移除的时机。
_createEnemy方法中会利用Game的宽度计算出一个随机的x坐标，然后由于要实现敌机从屏幕上方之外的位置从下移动的效果，所以将y坐标设置在-size.y的位置。
添加到Component树后，敌机Component就会执行前面的自动移动逻辑从上往下移动出屏幕。

【基于Flutter&Flame 的飞机大战开发笔记】敌机生成器

前言

敌机构建

自动移动

自动生成器