【pixi.jsゲームテンプレート】更新処理とタイルマップを改善

私の自作ゲームエンジンの問題が見つかった部分を改善しました。

ついでにバージョン番号も付けることにしたのでとりあえず現在の出来は7割くらいかなってことでver0.7としました。

更新処理の改善

今までのテンプレートではupdateメソッドで更新処理を行うにはSceneクラスがもっているregisterUpdatingObjectメソッドで登録する必要がありました。これはいいんですがこの登録できるクラスがSceneしかないためゲームを作るにはちょっと無理があることが分かりました。

addChildする際にその対象となるクラスすべてがregisterUpdatingObjectメソッドを持っていて更新処理を行うようにしておけばこの問題は解決されるはず!!

ということでContainer、SpriteにregisterUpdatingObjectメソッドを持たせ更新処理できるようにしました。

その際にいちいちregisterUpdatingObjectメソッドで登録するのも面倒なのでaddUpdateChildというメソッドを作りaddChildとregisterUpdatingObject両方を行ってくれるようにしました。なので更新処理を行いたいクラスは

this.addUpdateChild(player);

と書くだけでOKです。

本当はaddChildを拡張して作りたかったんですができませんでした(^^;)まぁしゃーないね。

タイルマップレイヤー

TileMapクラスに問題が見つかったので改善しました。

レイヤーになってるつもりだったんですが実際ちゃんとなってませんでした(;^ω^)

でこんな感じに使うようにしました。

map = new TileMap();
const mapData = resources[Resource.MapData.Stage1].data;
const data = {
  tileWidth: mapData.tilewidth as number,
  tileHeight: mapData.tileheight as number,
  tileColumns: mapData.width as number,
  tileRows: mapData.height as number //追加
}
map.setSizes(data);
map.prepareLayers(2);//追加。作るレイヤーの数
map.createMapLayer(0, mapData.layers[0].data);
map.setAnimation(0, mapAnimationFrameList);
map.setCollisionData(mapData.collision);
this.addUpdateChild(map);

prepareLayersでレイヤーを作ります。引数は作るレイヤーの数です。

レイヤー自体はContainerクラスなのでタイルマップ以外でもなんでもaddChildまたはaddUpdateChildできます。

なのでこのTileMapクラスをそのままステージとして使えます。欲しいだけレイヤーを作って0番が地面のタイルマップ、1番が敵キャラ、2番がプレイヤー、3番が上にくるタイルマップなんて使い方もできます。

レイヤーはlayersという名前の配列になっているので直接触る場合はmap.layers[0]という感じで使ってください。

あとがき

今回の問題点はテストとして作ったボンバーマンもどきを開発していた時に見つかりました。

やはり実際にゲームを作ってみないと問題があっても気づかないですね(^^;)

テストとして作ったボンバーマンもどきのリンクを張っておくので遊んでみてください。

私のテンプレートでここまでのものが作れます(まだバーチャルキーパッドは公開してないですが)

爆弾野郎

コメントを残す

メールアドレスが公開されることはありません。

ゲームタグ一覧

おすすめゲーム

  • ゲーム「さめがめ」のサムネイル
    さめがめ
    同じ色で複数くっついているタイルをタッチして消すパズルゲーム。一度にたくさん消すと高得点!
  • ゲーム「フリック&チェイン」のサムネイル
    フリック&チェイン
    同色のブロックを4つ以上つなげると消えるパズルゲームです。ランキングはHARDのみ対応
  • ゲーム「コスモファイター」のサムネイル
    コスモファイター
    レトロ風の縦シューティングゲーム。敵が個性的に動き回わるところも懐かしさを感じます。
  • ゲーム「vs.蚊」のサムネイル
    vs.蚊
    部屋に蚊が侵入!その数10匹!何としても奴らを殲滅せねばならぬ!!一匹残らずぶっ潰せ!!
  • ゲーム「うえにいく」のサムネイル
    うえにいく
    障害物を避けながらただただ上を目指すゲーム。シンプルだけど集中力が必要です。