Phaser 3 | カメラをプレイヤーに追従させる方法
Phaser 3でカメラをプレイヤーに追従させる方法のサンプルコードです。
目次
カメラをプレイヤーに追従させる方法
カメラをプレイヤー追従させるサンプルコードです。
カメラの追従設定にはstartFollow()を利用します。基本的に2Dゲームであればサイドビューもトップダウンも指定・設定に大きな違いはないと思います。
mainCamera.startFollow(target, true);プレイヤーを追従したいカメラにstartFollow()でプレイヤーを指定することで実装可能です。
例えば、「mainCamera」というカメラを作成して、「player」というプレイヤーオブジェクトを追従する場合のサンプルコードです。
mainCamera = this.scene.cameras.main;
mainCamera.startFollow(this.player, true);追従する範囲を指定する
setBounds()を利用して、プレイヤーの追従を可能とする範囲、追従を停止する位置を指定できます。
正確には「カメラがスクロール可能な範囲を設定する」ですがstartFollow()はsetBounds()の設定を優先します。
mainCamera.setBounds(x, y, width, height);タイルマップを使ったサンプルゲームでは以下のように指定しています。
//16×16ピクセルのタイルサイズで横100タイル×縦20タイルのタイルマップ
mainCamera.setBounds(0, 0, 100 * 16, 20 * 16);補足
Gameについて
当サイトのサンプルコードでは、create()の最初にthisをGame.sceneに代入しています。
Game.sceneに代入しない場合は「Game.scene」を「this」に置き換えて下さい。
サンプルコードの基本構造とconfig設定
サンプルコードのphaser3を利用した基本構造については、以下の記事にて紹介しています。
Phaser 3 | サンプルコードで利用している基本構造 | ONE NOTES
サンプルで利用している素材、データファイルの一覧
サンプルコードで利用している素材、データファイルの一覧を以下ページで紹介しています。