How can I get rid of unwanted SwiftUI animation?-CodePudding

I have a black circle, when the app launches, I want its X offset to go from 0 to 100 with animation. In other words, I want the circle to move to the right with animation until it touches the right edge of the gray box. I also want the circle's color to change from black to blue abruptly without animation the moment it touches the right edge of the gray box.

As you can see below, the circle gradually changes from black to blue with animation even though my code doesn't specify that it should change color with animation.

How can I get rid of this unwanted animation and make the color change abruptly the moment the circle touches the edge of the gray box?

import SwiftUI

struct ContentView: View {
    @State var circleOffset:CGFloat = 0
    var body: some View {
        HStack {
            Circle()
                .frame(width: 100)
                .offset(x: circleOffset)
                .foregroundColor(circleOffset == 100 ? .blue : .black)
        }
        .frame(width: 300, height: 150)
        .background(Color.gray)
        .onAppear{
            withAnimation(.linear(duration: 2)) {
                circleOffset = 100
            }
        }
    }
}

CodePudding user response：

You join color change on the same state, which you made animatable, so if you need color changed instantly you have to update it using different, non-animatable, state, like

struct ContentView: View {
    @State var circleOffset:CGFloat = 0
    @State var toggleColor = false
    var body: some View {
        HStack {
            Circle()
                .frame(width: 100)
                .foregroundColor(toggleColor ? .blue : .black)
                .offset(x: circleOffset)
        }
        .frame(width: 300, height: 150)
        .background(Color.gray)
        .onAppear{
            withAnimation(.linear(duration: 2)) {
                circleOffset = 100
            }
            DispatchQueue.main.asyncAfter(deadline: .now()   2) {
                toggleColor.toggle()
            }
        }
    }
}

Tested with Xcode 13 / iOS 15