SwiftUI `matchedGeometryEffect` - Update view color along with animation

Viewed 70

I am using matchedGeometryEffect in my code and want change my view color in the process as well. The issue that I got here is this: matchedGeometryEffect use a fade effect by default for updating views, which renders the colors in a wrong way.

I have added another "control" Circle with the correct color changing process. I would like do the same, with matchedGeometryEffect.

struct ContentView: View {
    
    @Namespace var animationNamespaceon
    @State private var start: Bool = Bool()
    
    var body: some View {
        
        VStack {
            
            Circle()
                .frame(width: start ? 300 : 50, height: start ? 300 : 50)
            
            circle
            
        }
        .foregroundColor(Color(red: start ? 1 : 0, green: 0, blue: 0))
        .onTapGesture { start.toggle() }
        .animation(Animation.linear(duration: 5), value: start)
        
    }
    
    @ViewBuilder var circle: some View {
        if start {
            Circle()
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 300, height: 300)
            
        }
        else {
            Circle()
                .matchedGeometryEffect(id: "Circle", in: animationNamespaceon)
                .frame(width: 50, height: 50)
            
        }
    }
}
0 Answers
Related