キャンバス・レイヤー

Viewportとキャンバス・アイテム

Node2DControl などの通常の2Dノードは、すべての2Dノードのベースである CanvasItem から両方とも継承されます。CanvasItemはツリーに配置でき、その幾何学変換を継承します。つまり、親を移動すると、子も移動します。

これらのノードは Viewport の直接または間接の子として配置され、Viewportを通して表示されます。

Viewportには Viewport.canvas_transform プロパティがあります。これにより、カスタム Transform2D 幾何学変換によってすべてのCanvasItem階層を変換できます。 Camera2D などのノードは、その変換を変更することで機能します。

スクロールのような効果を得るには、キャンバスのtransformプロパティを操作します。この方法は、ルートキャンバス項目(シーン全体が)を移動するよりも効率的です。

しかし通常は、ゲームやアプリケーションのすべてをキャンバス変換の対象にすることは望ましくありません。 この例は次のとおりです:

  • パララックス背景:ステージの他の部分よりもゆっくり移動する背景。
  • UI: ヘッドアップディスプレイ、またはユーザーインターフェイス。 背景が動いても、ライフカウンターやスコアなどは移動しないはずです。
  • トランジション:トランジション(フェード、ブレンド)に使用されるエフェクトでも、固定された場所に留めておくことが望ましい場合があります。

単一のシーンツリーでこれらの問題をどのように解決できるでしょうか?

キャンバス・レイヤー

その答えは CanvasLayer です。これは、そのすべての子と孫のために別々の2Dレンダリングレイヤを追加するノードです。CanvasLayerは任意の数値レイヤで描画しますが、Viewportの子はデフォルトでレイヤー "0" で描画します。大きい番号のレイヤーは小さい番号のレイヤーの上に描画されます。CanvasLayersにも独自の幾何学変換があり、他のレイヤーの幾何学変換には依存しません。これにより、UIをスクリーンスペースに固定しながら、ゲームのワールドに対するビューを変更できます。

この一例は、パララックスの背景を作成することです。 これはCanvasLayerの "-1" レイヤーで行うことができます。ポイント、ライフカウンター、ポーズ・ボタンを含む画面もレイヤー "1" で作成できます。

外観は次のとおりです:

../../_images/canvaslayers.png

キャンバス・レイヤーはツリーの順序に依存せず、レイヤ番号のみに依存するため、必要に応じてインスタンス化できます。

注釈

キャンバス・レイヤーはノードの描画順序を制御する必要はありません。 ノードが他のノードの「前面」または「背面」に正しく描画されるようにするための標準的な方法は、シーンパネル内のノードの順序を操作することです。 おそらく直感に反して、シーンパネルの一番上のノードはViewportの下のノードの*後ろ*に描かれています。 2dノードは描画順を制御するためのプロパティも持っています( Node2D.z_index を参照してください)。