SwiftUI垂直TabView视图右移：求跨设备高效居中适配方案

旋转TabView实现垂直滚动时出现的偏移，本质是PageTabViewStyle的原生布局逻辑在旋转后，尺寸计算与视图对齐出现了偏差。以下是替代固定offset的高效适配方案，仅修改AllVideoView即可：

修改后的代码 #

struct AllVideoView: View {
    @State private var selected = ""
    @State private var arr = ["-q6-DxWZnlQ", "Bp3iu47RRJQ", "lXJdgDjw1Ks", "It3ecCpuzgc", "7WNJjr8QM1w"]
    
    var body: some View {
        ZStack {
            Color.black.edgesIgnoringSafeArea([.bottom, .top])
            
            // 使用GeometryReader获取当前视图的准确可用尺寸
            GeometryReader { geo in
                TabView(selection: $selected){
                    ForEach(arr, id: \.self){ id in
                        SingleVideoView(link: id)
                            .tag(id)
                            // 让子视图填充TabView的可用空间
                            .frame(width: geo.size.height, height: geo.size.width)
                            .rotationEffect(.init(degrees: -90))
                    }
                }
                // 设置TabView的尺寸为父容器的高x宽（对应旋转后的垂直滚动）
                .frame(width: geo.size.height, height: geo.size.width)
                .rotationEffect(.init(degrees: 90))
                .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
                // 强制TabView对齐到父容器的中心
                .position(x: geo.size.width/2, y: geo.size.height/2)
            }
        }
    }
}

关键改动说明 #

• 用GeometryReader替代全局尺寸函数：直接获取当前视图的可用空间尺寸，避免因设备安全区、屏幕比例差异导致的尺寸计算误差。
• 调整子视图与TabView的frame关联：让子视图的尺寸与TabView的旋转后尺寸匹配，确保内容填充完整。
• 显式设置position居中：通过position方法强制TabView在父容器中居中，彻底解决旋转后的偏移问题，适配所有设备。
• 移除冗余的frame设置：删除原代码中ForEach外层的固定frame，让布局逻辑更简洁可靠。

这个方案不需要硬编码offset，完全依赖视图的原生布局逻辑实现自适应居中，适配所有设备的屏幕尺寸和比例。

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