SwiftUI教程：如何在动画结束后移除指定视图

要让对勾缩放动画结束后视图消失，你可以通过新增状态变量控制可见性，并在完整动画序列结束后触发隐藏动画，具体修改如下：

修改后的完整代码 #

struct CheckmarkAnimation: View {
    @State private var isAnimating = false
    // 新增状态变量控制视图是否可见
    @State private var isVisible = true

    var body: some View {
        ZStack {
            Circle()
                .trim(to: isAnimating ? 1:0)
                .stroke(.green, lineWidth: 3)
                .frame(width: 100, height: 100)
                .animation(.easeInOut(duration: 1), value: isAnimating)
            
            Image(systemName: "checkmark")
                .foregroundColor(.green)
                .font(.largeTitle)
                .scaleEffect(isAnimating ? 1.5 : 0)
                .animation(.spring(response: 0.5, dampingFraction: 0.4).delay(1), value: isAnimating)
        }
        // 用透明度控制视图消失，添加淡出动画
        .opacity(isVisible ? 1 : 0)
        .animation(.easeOut(duration: 0.3), value: isVisible)
        .onAppear {
            isAnimating.toggle()
            // 计算动画总时长：圆环动画1秒 + 对勾缩放动画0.5秒 = 1.5秒
            // 延迟对应时间后触发隐藏
            DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
                isVisible = false
            }
        }
    }
}

关键改动说明 #

• 新增isVisible状态：用来控制视图的显示与隐藏，初始值为true保证视图一开始可见。
• 添加消失动画：通过opacity修饰符实现淡出效果，搭配animation修饰符让消失过程更平滑；如果你想要缩放消失的效果，只需把opacity(isVisible ? 1 : 0)替换为scaleEffect(isVisible ? 1 : 0)即可。
• 精准触发隐藏时机：通过DispatchQueue.main.asyncAfter延迟1.5秒（刚好是圆环动画+对勾动画的总时长），确保对勾缩放完成后才开始消失。

你也可以用withAnimation直接包裹状态变化，替代单独的animation修饰符，效果一致：

DispatchQueue.main.asyncAfter(deadline: .now() + 1.5) {
    withAnimation(.easeOut(duration: 0.3)) {
        isVisible = false
    }
}

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