'How can I solve MatchedGeometryEffect fade effect issue in SwiftUI?
I am using matchedGeometryEffect in my code to get smooth transition, when I am using it, everything works fine but Color get fade in process, which I want color do not get fade, I looked the same issue in older questions and answers, and I used the approach of the answer, but still my transition have fade effect! How can I remove fade effect there?
struct ContentView: View {
@Namespace var namespaceOfCircle
@State private var update: Bool = false
var body: some View {
VStack {
if update {
VStack {
Circle()
.foregroundColor(Color.black)
.matchedGeometryEffect(id: "Circle", in: namespaceOfCircle)
.transition(.scale(scale: 1))
.frame(width: 100, height: 100)
Spacer()
}
}
else {
VStack {
Spacer()
Circle()
.foregroundColor(Color.black)
.matchedGeometryEffect(id: "Circle", in: namespaceOfCircle)
.transition(.scale(scale: 1))
.frame(width: 300, height: 300)
}
}
}
.background(Button("update") { update.toggle() })
.animation(.linear(duration: 5.0), value: update)
}
}
Solution 1:[1]
It is important a place of applied modifiers, here you insert/remove not a circle but VStack, so the fix is to move transition there.
Tested with Xcode 13.3 / iOS 15.4
Main part is:
if update {
VStack {
Circle()
.matchedGeometryEffect(id: "Circle", in: namespaceOfCircle)
.frame(width: 100, height: 100)
Spacer()
}
.transition(.scale(scale: 1)) // << here !!
Complete findings and code is here
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 |

