You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

SwiftUI TabView横向动画转场后内容偏移问题求助

SwiftUI横屏模式下TabView(.page样式)横向转场动画偏移Bug

问题现象

在横屏模式下,SwiftUI的TabView使用.tabViewStyle(.page)样式,同时搭配任何横向移动类转场动画(例如.move(edge: .leading/.trailing)、.slide、.offset()等)时,会出现转场Bug:TabView进入时内容偏移,动画来回晃动后才恢复稳定状态。

测试环境与Bug提交

已在以下环境中验证该问题:

  • Xcode 15.3(版本号15E204a)
  • iOS 17.3.1 iPhone实体设备
  • iOS 17.4模拟器

已向Apple提交Bug报告,编号为FB13687638。

排查与更新记录

  • 【更新1】该问题与安全区域相关,在Touch ID设备上不会触发此Bug。
  • 【更新2】尝试给TabView添加.ignoresSafeArea(edges: .horizontal)、将全局动画改为.easeInOut并移除VStack的.padding()后,初始转场的偏移问题得到修复,但标签页滑动切换时仍存在偏移异常。
  • 【更新3】应用上述所有修改后UI仍存在问题,目前唯一可行的临时解决方案是更换非横向类的转场效果。

测试代码

import SwiftUI

struct ContentView: View {
    @State private var showTabView = false
    var body: some View {
        VStack {
            Button("Toggle TabView") {
                showTabView.toggle()
            }
            Spacer()
            if showTabView {
                TabView {
                    Text("Page One")
                    Text("Page Two")
                }
                .tabViewStyle(.page)
                .transition(.slide)
            }
        }
        .animation(.default, value: showTabView)
        .padding()
    }
}

#Preview {
    ContentView()
}

@main
struct TabViewTransitionBugApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

内容的提问来源于stack exchange,提问作者clns

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.27 18:57:55