SceneView とギズモ

SceneView は、実際にオーサリングを行うパネルです。シーンをオービット（周回）しながら、クリックでエンティティを選択し、トランスフォームギズモをドラッグして移動・回転・スケールできます。あらゆる変更はライブの ECS ワールドに直接書き込まれ、完全にアンドゥ可能です。SceneView には 3D と UI の 2 つのモードがあり、ツールバーのドロップダウンではそれぞれ 3D・2D と表示されます。このドロップダウンから切り替えでき、選んだモードはセッションをまたいで保持されます。

選択中のエンティティにトランスフォームギズモが表示されたオービットビューポート。色付きの軸をドラッグしてトランスフォームします。

SceneView の場所

エディタのシェルは、ドッキング可能なタブ付きパネルの集合です（flexlayout ベース）。パネルには Game・Scene・Console・Hierarchy・Assets・Inspector があります。任意のパネルを別の位置へドラッグしたり、レイアウトを分割したり、1 つのパネルを最大化したりできます。SceneView は Scene タブにあたります。

ドッキング可能なタブ付きパネル群: Game・Scene・Console・Hierarchy・Assets・Inspector。

3D モード

3D モードは Three.js のオービットカメラです。ドラッグでシーンをオービットし、スクロールホイールでズームします。オブジェクトをクリックすると選択でき、クリック位置はレイキャストによって解決されます。選択したエンティティにはトランスフォームギズモ（Three.js の TransformControls）が表示され、これをドラッグして編集します。

ツールバー

SceneView のツールバーには、左から順に次の項目が並びます。

• 現在のシーン／ファイル名。
• 3D / 2D モードのドロップダウン（2 つの選択肢は 3D・2D と表示されます）。
• **移動（Translate）**ギズモ — ショートカット W、アイコン ✥。
• **回転（Rotate）**ギズモ — ショートカット E、アイコン ↻。
• **スケール（Scale）**ギズモ — ショートカット R、アイコン ⤡。
• ギズモをワールド空間とローカル空間で切り替える、G と表示された空間トグル — ショートカット X。
• ✦ FX — シーン内でパーティクル効果をプレビューします — ショートカット P。
• ▦ Grid — 地面のグリッドの表示／非表示を切り替えます（3D モード）— ショートカット G。
• ◫ Colliders — すべてのコライダーのワイヤーフレームの表示／非表示を切り替えます（3D モード）— ショートカット C。

ギズモでの編集

ギズモの軸をドラッグすると、選択中のエンティティがトランスフォームされます。変更はライブの ECS ワールドに書き込まれ、アンドゥできます。Inspector との連携は双方向です。ビューポートでエンティティを動かすと Inspector の Transform の数値がリアルタイムで更新され、その数値を編集するとビューポート内のエンティティが動きます。

1. エンティティを選択する — ビューポート内のオブジェクトをクリックします。そのオブジェクトにギズモが表示されます。
2. ツールを選ぶ — W で移動、E で回転、R でスケール（あるいは対応するツールバーのボタンをクリック）。
3. 軸をドラッグする — 色付きの軸ハンドルのいずれかをつかんでドラッグし、エンティティをトランスフォームします。操作に合わせて Inspector の Transform フィールドが更新される様子を確認しましょう。
4. 必要なら空間を切り替える — X（G ボタン）を押して、ギズモをワールド空間とローカル空間で切り替えます。
5. 間違えたらアンドゥする — 各ドラッグはアンドゥ可能な変更として書き込まれるため、エディタのアンドゥで元に戻せます。

TIP

P を押す（または ✦ FX をクリックする）と、オーサリング中にパーティクル効果を SceneView 上で直接プレビューできます。

UI モード

ドロップダウンを 2D に切り替えると、SceneView は ECS 駆動の UI をデバイスサイズで表示する DOM プレビューになります。UI 要素をクリックして選択し、専用の移動・リサイズギズモでレイアウトします。UI 要素は UIElement トレイトと UIAnchor トレイトを持つ通常のエンティティです。同じモードでは、専用の 2D ギズモを使って 2D キャンバスのコンテンツ（Canvas2D 配下の Renderable2D）も編集できます。

SceneView と GameView の違い

独立した Game タブは、3D・2D・UI という 3 つのレンダリングレイヤーすべてを合成し、任意のデバイスサイズで表示するライブ実行プレビューです。停止中は "Press Play to interact" と表示され、Play を押すと実際のゲームが実行されます。

補足

SceneView はオーサリングのためのもので、エンティティの選択や配置を行います。GameView はプレイのためのもので、実際に動作しているゲームを動かします。SceneView でシーンを構築し、Game タブに切り替えてテストしましょう。

次は: アセットとインポート →