Phaser3 ver3.50.0 で色々と変わっていた

これまで私がずっと使っていたのは 3.24.1 だったが、久しぶりにnpm updateしたらバージョンも 3.52.0 になっていて、その中で色々と変わってPhaser3のバージョンアップに合わせて色々書き直すところが出たのでそのまとめ。

変更点は後述するとして、とりあえず書いておきたいのは 破壊的な変更を含め活発にupdateされているので(活発なのはとても良いこと)記事が古くなることがこれからも起こり続けると思うので注意してね ということ。私が使っているPhaser3となんか違うな、と思ったらバージョンの違いを疑ってみてください。

なので、内部の細かい処理をここで書いてもそもそもあまり参考にならないかもしれない。また、これからは覚えている限りバージョンを書こうと思っています。

以降、自分が影響を受けた範囲で記述。書いてある他にもいろいろあると思います。

Tilemapの変更

それまで、動的にタイルの状態が変更できる DynamicTilemapLayer と描写が固定されるが描写速度に優れた StaticTilemapLayer に分かれていたのが、 TilemapLayer に統合されました。

https://github.com/photonstorm/phaser/commit/0ba1f08f800efdad6a4f22adea27c300fe292212#diff-507b75a31f355e5d4fe9433df4f5cb052e5c0ea0f140dd04ecea0fda494854a7

Animationの変更

それまでSpriteのアニメーションはSpriteに GameObject.Component.Animation がくっついていて、これが各Spriteのアニメ―ジョンの状態を保管していたのが、 Animation.AnimationState に変更になりました。

また、 Animation.Animation はEventEmitterを継承し、アニメーションの各イベント(startやcomplete)の発火はSpriteオブジェクトとAnimationオブジェクトに対して行われていたが、AnimationオブジェクトがEventEmitterを継承しなくなったのでアニメーションに関わるイベントは全てSpriteオブジェクトに仕掛けることになりました。この関係で、イベント名も変更され、Sprite用のイベント名 SPRITE_ANIMATION_XXX_EVENT などが削除されて単に ANIMATION_COMPLETE (これはSprite用)などになりました。

アニメーションは Animation.Animation は状態を持たず、 Animation.AnimationState が状態を持つ仕様なので Animation.Animation オブジェクトがEventEmitterを持たないのは自然なことだと思った。

戻値いろいろ変わっている

Phaser3は、例えばSpriteの操作を行う場合…

sprite
  .setOrigin(0)
  .setPosition(256, 16)
  .setDepth(4);

のようにチェーンさせて書けるように戻り地を this にしていることが多いのですが、一部そうなっていなかった関数があったのですが、それが this に変更されていました。私が確認したのは Tilemap 廻りですが、他にもそういうところが有るかもしれない。

私はtypescriptを使っているので戻り値の変更はコンパイルが蹴ってくれるので良いのですが、jsで書いている場合は実行時エラーを踏むまで気付きにくそうだなと思った。