Animated state changes in iOS Swift - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What is the output of this SwiftUI animation code?

Consider this SwiftUI view that toggles a circle's color with animation when tapped. What color will the circle show after tapping once?

iOS Swift

struct ContentView: View {
  @State private var isRed = false
  var body: some View {
    Circle()
      .fill(isRed ? Color.red : Color.blue)
      .frame(width: 100, height: 100)
      .onTapGesture {
        withAnimation {
          isRed.toggle()
        }
      }
  }
}

A The circle changes from blue to red smoothly with animation.

B The circle instantly changes from blue to red without animation.

C The circle changes from red to blue smoothly with animation.

D The circle does not change color on tap.

💡 Hint

Look at the initial color and the toggle inside withAnimation block.

The circle starts blue because isRed is false. Tapping toggles isRed to true inside withAnimation, so the fill color animates smoothly to red.

❓ lifecycle

intermediate

Which SwiftUI lifecycle event triggers the animation in this code?

Given this SwiftUI view, when does the animation run?

iOS Swift

struct ContentView: View {
  @State private var scale: CGFloat = 1.0
  var body: some View {
    Circle()
      .scaleEffect(scale)
      .onAppear {
        withAnimation(.easeInOut(duration: 1)) {
          scale = 2.0
        }
      }
  }
}

A When the circle is tapped.

B When the view appears on screen.

C When the scale variable is manually changed outside the view.

D When the view disappears from screen.

💡 Hint

Check the modifier that triggers the animation.

The animation is inside onAppear, so it runs once when the view first appears on screen.

🔧 Debug

advanced

Why does this SwiftUI animation not run as expected?

This code intends to animate the opacity change, but the circle instantly disappears without animation. Why?

iOS Swift

struct ContentView: View {
  @State private var isVisible = true
  var body: some View {
    Circle()
      .opacity(isVisible ? 1 : 0)
      .onTapGesture {
        isVisible.toggle()
      }
  }
}

A Because the Circle view does not support opacity modifier.

B Because opacity cannot be animated in SwiftUI.

C Because onTapGesture does not trigger state changes.

D Because the opacity change is not wrapped inside withAnimation block.

💡 Hint

Animations require explicit withAnimation or implicit animation modifiers.

Without withAnimation, state changes happen instantly without animation. Wrapping isVisible.toggle() inside withAnimation fixes this.

❓ navigation

advanced

What happens to the animation when navigating back in this SwiftUI NavigationStack?

This view animates a rectangle's width on appear. What happens when the user navigates back to this view?

iOS Swift

struct DetailView: View {
  @State private var width: CGFloat = 100
  var body: some View {
    Rectangle()
      .frame(width: width, height: 50)
      .onAppear {
        width = 100
        withAnimation(.linear(duration: 1)) {
          width = 200
        }
      }
  }
}

struct ContentView: View {
  var body: some View {
    NavigationStack {
      NavigationLink("Go to Detail", destination: DetailView())
    }
  }
}

A The rectangle animates from width 100 to 200 every time the DetailView appears.

B The rectangle animates only the first time DetailView appears, not on back navigation.

C The rectangle width stays at 200 without animation on back navigation.

D The rectangle does not animate at all.

💡 Hint

onAppear runs every time the view appears on screen.

Each time DetailView appears, onAppear triggers the animation from width 100 to 200.

🧠 Conceptual

expert

Which statement about SwiftUI animated state changes is true?

Choose the correct statement about how SwiftUI handles animated state changes.

A Animations in SwiftUI require manual frame-by-frame updates for smooth transitions.

B SwiftUI animations only work on color and opacity properties, not on layout changes.

C State changes inside withAnimation blocks animate all affected view properties automatically.

D State changes outside withAnimation blocks never update the UI.

💡 Hint

Think about how withAnimation affects state changes.

withAnimation tells SwiftUI to animate all view changes caused by the state change inside it, including layout and color.