SwiftUI视图切换过渡失效求助：实现加载页与内容页淡入淡出

你的代码无法触发淡入淡出动画的核心原因有两点：

1. if-else 互斥结构导致两个视图不会同时存在于视图树中，SwiftUI 无法捕捉到视图的添加/移除动作，过渡动画自然无法触发。
2. 动画修饰器(.animation)被添加在子视图上，而非父容器，导致动画上下文未正确关联到状态变化。

修正后的代码方案 #

下面是两种可行的实现方式，都能实现 LoadingView 淡出、ContentView 淡入的效果：

方案一：叠加视图实现过渡

让两个视图始终存在于 ZStack 中，通过状态控制顶层视图的显示/隐藏：

struct MyApp: App {
    @State private var isLoading = true

    var body: some Scene {
        WindowGroup {
            ZStack {
                // 底层始终保留 ContentView
                ContentView()
                
                // 顶层根据状态显示 LoadingView
                if isLoading {
                    LoadingView()
                        .transition(.opacity)
                }
            }
            // 将动画修饰器应用到父容器，关联状态变化
            .animation(.easeOut(duration: 2.0), value: isLoading)
            .onAppear {
                startApp()
            }
        }
    }

    private func startApp() {
        DispatchQueue.main.asyncAfter(deadline: .now() + 2.0) {
            isLoading = false
        }
    }
}

方案二：同步触发两个视图的过渡动画

如果需要让 ContentView 也从无到有淡入，可以让两个视图都通过条件控制添加/移除，同时用 withAnimation 包裹状态修改：

struct MyApp: App {
    @State private var isLoading = true

    var body: some Scene {
        WindowGroup {
            ZStack {
                if !isLoading {
                    ContentView()
                        .transition(.opacity)
                }
                
                if isLoading {
                    LoadingView()
                        .transition(.opacity)
                }
            }
            .onAppear {
                startApp()
            }
        }
    }

    private func startApp() {
        DispatchQueue.main.asyncAfter(deadline: .now() + 2.0) {
            // 用 withAnimation 包裹状态修改，显式触发动画
            withAnimation(.easeInOut(duration: 2.0)) {
                isLoading = false
            }
        }
    }
}

关键注意事项 #

• 过渡动画(.transition)仅在视图被添加到视图树或从视图树移除时触发，必须避免互斥的 if-else 结构导致视图直接被替换。
• 动画上下文的作用范围要正确：要么将 .animation 修饰器应用到父容器，要么用 withAnimation 包裹状态修改操作，确保状态变化能触发关联的动画。

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