如何使用DispatchQueue实现视图定时显示、执行动画后隐藏？异步多时间点任务实现指南

Hey Paul, nice work getting your hand gesture view up and running! While your current code works, we can make it cleaner, more maintainable, and aligned with modern SwiftUI best practices. Let's break this down with an optimized implementation first, then cover key guidelines for handling sequential async tasks in views.

Optimized Implementation Using Swift Concurrency #

Instead of nested DispatchQueue.asyncAfter calls (which can lead to "callback hell"), we'll use Swift's native concurrency tools (Task and async/await) for a more linear, readable flow. This also plays nicer with SwiftUI's lifecycle:

import SwiftUI

struct ContentView: View {
    @State private var toggleHandAnimation = false
    @State private var showHand = true
    
    // Define time constants for easy maintenance
    private let animationStartDelay: TimeInterval = 1.0
    private let hideDelay: TimeInterval = 5.0
    
    var body: some View {
        if showHand {
            Image(systemName: "hand.draw")
                .font(.system(size: 100))
                .offset(x: toggleHandAnimation ? -40 : 0)
                // Tie animation explicitly to the state variable (SwiftUI 3.0+ best practice)
                .animation(
                    .easeInOut(duration: 0.6).repeatCount(5),
                    value: toggleHandAnimation
                )
                .onAppear {
                    Task {
                        // Wait 1 second before triggering animation
                        try await Task.sleep(nanoseconds: UInt64(animationStartDelay * 1_000_000_000))
                        toggleHandAnimation = true
                        
                        // Wait 5 seconds after animation starts to hide the view
                        try await Task.sleep(nanoseconds: UInt64(hideDelay * 1_000_000_000))
                        showHand = false
                    }
                }
        }
    }
}

Key Improvements Here: #

• Linear async flow: No nested callbacks, making the sequence of actions easy to follow at a glance.
• Explicit animation triggers: We pass value: toggleHandAnimation to the modifier, ensuring the animation only runs when this state changes (avoids unexpected animations in newer SwiftUI versions).
• Maintainable time values: Constants for delays mean you can tweak timings without hunting for magic numbers in the code.
• Lifecycle safety: Task automatically cancels if the view is destroyed (e.g., user navigates away) before the sequence finishes, preventing unnecessary state updates.

Guidelines for Handling Sequential Async Tasks in SwiftUI Views #

When you need to run multiple async actions at specific times in a view, follow these best practices:

• Prioritize Swift Concurrency over DispatchQueue:
  Task and async/await are designed for SwiftUI and automatically handle main-thread state updates (no need for DispatchQueue.main.async when modifying @State or @Published properties). They also integrate with view lifecycle for automatic cancellation.

• Separate logic from view code (for complex sequences):
  If your async flow grows beyond a few steps, move the logic to a view model to keep your view focused on rendering:

  class HandGestureViewModel: ObservableObject {
      @Published var showHand = true
      @Published var toggleHandAnimation = false
      
      private let animationStartDelay: TimeInterval = 1.0
      private let hideDelay: TimeInterval = 5.0
      
      func startGestureSequence() {
          Task {
              try await Task.sleep(nanoseconds: UInt64(animationStartDelay * 1_000_000_000))
              toggleHandAnimation = true
              
              try await Task.sleep(nanoseconds: UInt64(hideDelay * 1_000_000_000))
              showHand = false
          }
      }
  }
  
  struct ContentView: View {
      @StateObject private var viewModel = HandGestureViewModel()
      
      var body: some View {
          if viewModel.showHand {
              Image(systemName: "hand.draw")
                  .font(.system(size: 100))
                  .offset(x: viewModel.toggleHandAnimation ? -40 : 0)
                  .animation(.easeInOut(duration: 0.6).repeatCount(5), value: viewModel.toggleHandAnimation)
                  .onAppear {
                      viewModel.startGestureSequence()
                  }
          }
      }
  }
  

• Handle task cancellation:
  If your tasks involve long-running work (like network calls), add checks for cancellation to avoid wasted resources:

  Task {
      try await Task.sleep(nanoseconds: 1_000_000_000)
      guard !Task.isCancelled else { return }
      toggleHandAnimation = true
      
      try await Task.sleep(nanoseconds: 5_000_000_000)
      guard !Task.isCancelled else { return }
      showHand = false
  }
  

• Avoid implicit animations:
  Never use .animation() without a value parameter in modern SwiftUI. This can cause unintended animations when unrelated state changes. Always tie animations directly to the state variable that triggers them.

• Use constants for hardcoded values:
  Timings, offsets, and animation durations should be defined as constants (not inline numbers) to make your code easier to update and debug.

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