如何在SwiftUI中基于设备旋转与重力实现视图移动？

核心问题修正 #

你当前用的陀螺仪（CMGyroData）检测的是设备旋转速率，但要实现重力跟随效果，应该用设备运动的重力分量（CMDeviceMotion.gravity），它能直接获取当前重力相对于设备坐标系的方向，更适合模拟物体受重力影响的运动。

完整实现步骤与代码 #

以下是可直接运行的完整代码，包含UI绘制、CoreMotion数据绑定、重力位置计算：

import SwiftUI
import CoreMotion

struct GravityRingView: View {
    // 存储重力的X/Y分量（UI坐标系适配后）
    @State private var gravityX: Double = 0
    @State private var gravityY: Double = 0
    
    private let motionManager = CMMotionManager()
    private let updateQueue = OperationQueue()
    
    // 环形参数
    private let ringRadius: CGFloat = 150
    private let ballSize: CGFloat = 30
    
    var body: some View {
        ZStack {
            // 外层环形
            Circle()
                .stroke(Color.gray, lineWidth: 8)
                .frame(width: ringRadius * 2, height: ringRadius * 2)
            
            // 跟随重力的小球
            Circle()
                .fill(Color.red)
                .frame(width: ballSize, height: ballSize)
                .offset(
                    x: CGFloat(gravityX) * (ringRadius - ballSize/2),
                    y: CGFloat(gravityY) * (ringRadius - ballSize/2)
                )
        }
        .onAppear(perform: startMotionUpdates)
        .onDisappear(perform: stopMotionUpdates)
        .navigationTitle("重力环视图")
    }
    
    private func startMotionUpdates() {
        guard motionManager.isDeviceMotionAvailable else {
            print("设备不支持设备运动检测")
            return
        }
        
        // 设置更新间隔（越高越流畅，性能消耗也越大）
        motionManager.deviceMotionUpdateInterval = 1/60
        
        motionManager.startDeviceMotionUpdates(to: updateQueue) { motionData, error in
            guard let motion = motionData else {
                print("获取运动数据失败：\(error?.localizedDescription ?? "未知错误")")
                return
            }
            
            // 转换坐标系：设备坐标系的X/Y对应UI坐标系的反向，适配重力方向
            DispatchQueue.main.async {
                self.gravityX = -motion.gravity.x
                self.gravityY = motion.gravity.y
            }
        }
    }
    
    private func stopMotionUpdates() {
        motionManager.stopDeviceMotionUpdates()
    }
}

// 预览
struct GravityRingView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationStack {
            GravityRingView()
        }
    }
}

关键逻辑解释 #

1. 坐标系适配：
   设备的重力坐标系与SwiftUI的UI坐标系方向不同，所以对gravity.x取反，确保小球的移动方向和用户感知的重力方向一致。
2. 位置计算：
   用重力分量（范围-1到1）乘以环形的有效半径（环形半径减去小球半径的一半），确保小球始终在环形内部，不会超出边界。
3. 性能优化：
   设置deviceMotionUpdateInterval为1/60，匹配屏幕刷新率，同时在后台队列处理运动数据，只在主队列更新UI，避免卡顿。
4. 生命周期管理：
   在onDisappear停止运动更新，避免不必要的资源消耗。

扩展优化建议 #

• 可以添加阻尼效果：通过插值计算gravityX/gravityY的变化，让小球移动更平滑，模拟真实物理运动。
• 支持多设备方向：添加方向监听，动态调整坐标系转换逻辑。
• 添加权限提示：如果设备需要权限（部分iOS版本），可以提示用户开启运动与健身权限。

内容的提问来源于stack exchange，提问作者cleanrun