Skip to content

下のシーンに重ねて描画されるシーンを作る

シーン生成時に seethrough オプションを指定すると、そのシーンはシーンスタックの一つの下のシーンに重ねて描画されます。

凡例

javascript
var seethroughScene = new g.Scene({
  game: g.game,
  seethrough: true
});

// sheetourhgScene に遷移する。ただし現在のシーンは下 (奥側) に描画されつづける。
g.game.pushScene(seethroughScene);

前のシーンに戻る場合は、g.game.popScene() を利用してください。

利用例

次のコンテンツは、画面をタップ/クリックすると、灰色の矩形 (を表示するシーン) が覆い被さります。 灰色の矩形をタップ/クリックすると元のシーンに戻ります。

詳細

g.game.pushScene() を使うと、現在のシーンを残したまま別のシーンに遷移することができます。 その後 g.game.popScene() を呼び出すと、元のシーンに戻ります。

pushScene() は何度でも呼び出せます。言い換えれば、シーンは「積み重ねる」ことができます。 積み重なったシーンの集まりをシーンスタックと呼ぶと、 pushScene() は「シーンスタックの上に新しいシーンを載せる」関数、 popScene() は「シーンスタックの一番上のシーンを取り除く」関数と考えることができます。

通常、ゲーム画面に描画されるのはシーンスタックの一番上のシーン (カレントシーン) だけです。

この動作を変更するのが seethrough オプションです。 seethrough: true が指定されたシーン (シースルーシーン) は、描画に先立って一つ下のシーンの描画を行います。 すなわち 下のシーンの上に重ねて 描画されるシーンになります。 ただしその場合でも、 onUpdateonPointDown などの通知はカレントシーンだけが受け取ります。 カレントシーン以外のゲーム画面を動かし続けることはできません

TIP

いわゆる「メニュー画面」のように、背景として現在のシーンの上に重なる UI を表示したい状況を想定した機能です。 といっても通常のメニュー画面は一つのシーン内で作ってしまう方が簡単でしょう。

シースルーシーンは、特に「プレイヤーの選択によって必要なアセットが変化する」「全部のアセットを事前にロードすることは避けたい」ような場面で有効です。

関連情報