19. Sceneの基礎

はじめに

いまさらですが、Sceneの挙動についてきちんと理解していなかったので整理します。

主要メソッド

メソッド 動作 発生するイベント
start() 現在シーンを停止し、指定シーンを開始 現シーン:SHUTDOWN、新シーン:START
launch() 現在シーンを維持し、指定シーンも開始 新シーン:START
stop() 指定シーンを停止（非アクティブ化） SHUTDOWN
pause() シーンの更新を一時停止（表示は維持） PAUSE
resume() 一時停止したシーンを再開 RESUME
sleep() シーンを休止状態にする（表示は維持） SLEEP
wake() 休止状態のシーンを再開 WAKE
restart() シーンを再起動（停止→開始） SHUTDOWN → START
remove() シーンを完全に破棄 SHUTDOWN → DESTROY

シーン設計のベストプラクティス

1. シーン間のデータ共有

// データを渡す側
this.scene.start('GameScene', { level: 5, playerHealth: 100 });

// データを受け取る側
init(data) {
  this.level = data.level || 1;
  this.playerHealth = data.playerHealth || 100;
}

2. グローバルイベントを活用したシーン間通信

// イベント発信側
this.game.events.emit('ScoreChanged', { score: 1000 });

// イベント受信側
this.game.events.on('ScoreChanged', this.handleScoreChanged);

3. シーンの表示順序の制御

// UIシーンを最前面に表示
this.scene.bringToTop('UIScene');

// 背景シーンを最背面に表示
this.scene.sendToBack('BackgroundScene');

4. シーンの状態確認

if (this.scene.isActive('GameScene')) {
  // GameSceneがアクティブな場合の処理
}

if (this.scene.isPaused('UIScene')) {
  // UISceneが一時停止中の場合の処理
}

クリーンアップ

SHUTDOWNイベントのリスナーでイベントリスナーの解除やタイマー・Tweenの停止を行いましょう。

this.events.once(Phaser.Scenes.Events.SHUTDOWN, () => {
  // イベントリスナーの解除
  this.game.events.off('EventName', this.eventHandler);
  // タイマーの停止
  this.time.removeAllEvents();
  // Tweenの停止
  this.tweens.killAll();
  // 物理オブジェクトの削除
  this.physics.world.disable(this.player);
});

これにより、シーンがstop()された際に適切にクリーンアップが行われます。

startとlaunchの違い

startでは、現在のシーンをstopしたうえで、新しいシーンを開始します。

scene.start(key, data)

  • 動作: 現在のシーンを停止し、指定されたシーンを開始します
  • 効果: 現在実行中のシーンには SHUTDOWN イベントが発生します
  • 使用ケース: シーン間の完全な切り替え（タイトル画面→ゲームプレイなど）
  • 例: 
    this.scene.start('GameScene', { level: 1 });

scene.launch(key, data)

  • 動作: 現在のシーンを停止せずに、指定されたシーンを追加で開始します
  • 効果: 両方のシーンが同時にアクティブになります
  • 使用ケース: UIやHUDを別シーンとして重ねる場合など
  • 例: 
    this.scene.launch('UIScene', { playerStats: this.player.stats });

stopとremoveの違い

scene.stop()

シーンを一時的に非アクティブ状態にします。シーンのインスタンスはメモリに保持されたままで、後で再開することができます。

scene.remove()

シーンを完全に破棄します。内部的にはまずstop()が呼ばれてSHUTDOWNイベントが発生し、続いてDESTROYイベントが発生します。

まとめ

シーンについて整理しました。