前回の記事ではvisionOS SDKを試してみたが、今回はvisionOSで3DオブジェクトをWindowやVolumeで表示してみた。

ButtonタップでVolumeに3Dオブジェクトを表示

visionOSのテンプレートからプロジェクトを作成すると、WindowでNavigationSplitViewを表示するコードが生成されるが、以下のように書き換えておく。

• App Structに新たなWindowGroupを追加して、Model3Dを表示するViewを定義し、VolumetricWindowStyleを設定する

• ContentViewに環境変数であるopenWindowを追加して、Buttonタップでid指定でWindowを開く

@main
struct VisionOSTestApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
        
        WindowGroup(id: "volume") {
            VolumeView()
        }
        .windowStyle(.volumetric)
        .defaultSize(width: 0.5, height: 0.5, depth: 0.5, in: .meters)
    }
}

struct ContentView: View {
    // Window表示用の環境変数
    @Environment(\\.openWindow) private var openWindow
    
    var body: some View {
        VStack {
            // RealityKitContentパッケージにあるシーン
            Model3D(named: "Scene", bundle: realityKitContentBundle)
                .padding(.bottom, 50)
            
            Button("Show in volume") {
                openWindow(id: "volume")
            }
        }
    }
}

struct VolumeView: View {
    var body: some View {
        Model3D(named: "Scene", bundle: realityKitContentBundle)
    }
}

これを実行すれば、最初はWindowに3DオブジェクトとButtonが表示されるが、Buttonタップで3DオブジェクトがVolumeで表示される。

Reality Composer Proでシーンを変更する

visionOSの登場に伴い、3Dコンテンツの構築・編集・プレビューができるデベロッパーツールであるReality Composer Proも登場した。

先程テンプレートから作成したプロジェクトにはRealityKitContentというパッケージがデフォルトで追加されており、この中のPackage（Swift Packageではない方）というファイルを選択すると、3Dシーンが表示され、さらにOpen In Reality Composer ProでReality Composer Proを開いて編集することができる。

Reality Composer Proを開くと、こんな感じの画面が表示され、真ん中に3Dシーン、左側にヒエラルキー、右側にインスペクター、下側にプロジェクトブラウザーが表示されている（なんとなくUnity Editorの画面構成に似ている）。

試しに右上の「+」ボタンでMaterial Libraryからマテリアルを追加して、Sphereオブジェクトに設定してみると、表面がメタリックになって、シミュレータ上でも反映された。

さらに、新しいシーンを作成し、Assets Libraryからオブジェクトを選択して配置して、Xcodeの方でModel3D(named:bundle:)で名前を変更すれば、新しいシーンと選択したオブジェクトも表示された。

Reality Composer Proを使えば、3Dオブジェクトだけでなく、オーディオやパーティクルなども編集して、シーンとしてXcodeプロジェクトに取り込めるので、こちらのセッションもおすすめ。

参考