RealityKitで3Dモデルを表示してスワイプで回転させる方法【SwiftUI】

import RealityKit
import SwiftUI

/// 3Dモデルの表示とスワイプによる回転操作のサンプルです。
///
/// === Note ===
/// 座標の指定方法は[x, y, z]。回転の場合は軸になる。
/// 型がSIMD3<Float>であることに注意。
/// 例）let init_position: SIMD3<Float> = [0, 0, 0]
/// 3次元上での回転角の名称
///  yaw 左右の首振り、垂直軸
///  pitch 上下を向く傾き
///  roll 左右の傾き、前後軸の回転
/// スワイプ量がOvershootして回転がjumpする現象は実機でのみ発生した。
struct Case6: View {
    @State private var modelEntity: Entity?
    @State private var yaw: Float = 0  // 左右
    @State private var pitch: Float = 0  // 上下
    @State private var dragFrameCount: Int = 0
    @State private var lastTranslation: CGSize = .zero

    var body: some View {
        // 3Dモデルの表示
        RealityView { content in
            // USDZ読み込み
            if let entity = try? await Entity(named: "cube") {
                // シーンへ追加
                content.add(entity)
                // entity保存
                modelEntity = entity
            }
        }
        // スワイプで回転させるためのジェスチャーを追加
        .gesture(
            // minimumDistanceを0にすると、なんか不安定
            // 8フレーム目付近でもジャンプがあった。
            // minimumDistanceを1以上にすると安定する。
            // 大体3フレーム目までにジャンプがある。
            // coordinateSpaceはよくわからない。
            // DragGesture(minimumDistance: 0, coordinateSpace: .local)
            DragGesture(minimumDistance: 2)
                .onChanged { value in
                    // Entityがあるか確認
                    guard let entity = modelEntity else { return }

                    // フレーム数をカウント
                    // 先頭フレームを1〜3枚捨てたいのでカウントしている
                    dragFrameCount += 1

                    // 直前のフレームからの「差分（delta）」を計算
                    // 差分を使うことで、Overshoot気味のフレームを捨てることができる。
                    // translationのwidthとheightは、ドラッグ開始位置からの累積値
                    // なので、そのまま使うとジャンプする。
                    // 差分を取る必要がある。
                    let deltaX = Float(
                        value.translation.width - lastTranslation.width
                    )
                    let deltaY = Float(
                        value.translation.height - lastTranslation.height
                    )

                    // 現在の translation を次のフレームのために記憶
                    lastTranslation = value.translation

                    // DEBUG: フレーム数と差分を表示して確認
                    // 1〜3フレームあたりで移動量に大きい値があることに気づける。
                    // ゆっくりスワイプしてみるとわかる。
                    // 回転のジャンプは実機のみ発生した。
                    print("\(dragFrameCount):\(deltaY)")

                    // Overshoot気味のフレームを捨てる
                    // きっとiOSのドラッグジェスチャーの仕様なのだろう。
                    if dragFrameCount <= 3 {
                        // ジャスチャー開始時の大きめの値は使わずに捨てる
                        // minimumDistanceの値と関連するようだ。
                        // minimumDistanceを1にすると安定し、1〜3フレーム目に
                        // Overshootが収まるようになった。
                        // なので3フレーム目までは捨てることにした。
                        return
                    }

                    // 回転量調整、0.01がちょうどいい感じ。
                    yaw += deltaX * 0.01
                    pitch += deltaY * 0.01

                    // 上下回転を90°までに制限
                    // 上下回転に制限があったほうが見やすいらしい。
                    pitch = max(
                        -.pi / 2 + 0.01,
                        min(.pi / 2 - 0.01, pitch)
                    )

                    // Y軸回転
                    let yRotation = simd_quatf(
                        angle: yaw,
                        axis: [0, 1, 0]
                    )

                    // X軸回転
                    let xRotation = simd_quatf(
                        angle: pitch,
                        axis: [1, 0, 0]
                    )

                    // 回転を適用
                    entity.transform.rotation = yRotation * xRotation
                }
                .onEnded { _ in
                    // 指を離したらリセット
                    dragFrameCount = 0
                    lastTranslation = .zero
                    // DEBUG：コンソールはクリアできないので。切れ目を入れてLogを見やすくする
                    print("---")
                }
        )
    }
}

#Preview {
    Case6()
}

RealityView { content in
    // Loading USDZ file.
    if let entity = try? await Entity(named: "cube") {
        content.add(entity)
    }
}

modelEntity = entity

entity.transform.rotation = yRotation * xRotation

DragGesture(minimumDistance: 0)