SwiftUI NavigationView如何设置计时器延迟 无按钮自动跳转新视图

核心逻辑通过NavigationLink的isActive绑定属性配合全局队列延迟任务实现，无需用户交互即可自动触发跳转。

完整实现代码 #

import SwiftUI

struct AnimationPage: View {
    // 控制跳转的状态变量
    @State private var navigateToTarget = false
    // 控制动画的状态变量，可根据你的实际动画逻辑调整
    @State private var animationRunning = false
    
    var body: some View {
        NavigationView {
            // 这里替换成你自己的动画视图
            Circle()
                .scaleEffect(animationRunning ? 1.5 : 0.5)
                .opacity(animationRunning ? 0.3 : 1)
                .onAppear {
                    // 页面加载后启动循环动画
                    withAnimation(.easeInOut(duration: 1).repeatForever()) {
                        animationRunning = true
                    }
                    // 启动3秒延迟计时器
                    DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
                        // 修改状态触发自动跳转
                        navigateToTarget = true
                    }
                }
            // 隐藏的跳转链路，仅通过状态变量控制触发
            .background(
                NavigationLink(isActive: $navigateToTarget, destination: {
                    // 这里替换成你的目标视图
                    TargetView()
                }, label: {
                    EmptyView()
                })
                .hidden()
            )
            .navigationTitle("动画页")
        }
    }
}

// 示例目标视图
struct TargetView: View {
    var body: some View {
        Text("跳转完成的目标页面")
            .navigationTitle("目标页")
    }
}

注意事项 #

• 绑定跳转状态的NavigationLink必须放在当前动画页的NavigationView层级内，否则跳转不会生效
• 如果需要支持从目标页返回后再次触发倒计时跳转，可在动画页的onDisappear回调中添加navigateToTarget = false重置状态
• 延迟任务要放在主队列执行，避免状态修改后UI没有同步更新
• 如果你使用的是SwiftUI 3+的NavigationStack，只需要把NavigationLink逻辑替换为navigationDestination绑定路径即可，倒计时逻辑完全通用

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