Qu'est-ce que matchedGeometryEffect et comment l'utiliser dans SwiftUI ?

matchedGeometryEffect dans SwiftUI est utilisé pour créer une animation fluide de transition entre deux vues représentant le même élément visuel dans différents layouts. Il relie la géométrie d'une vue dans un état à celle d'une autre vue dans un autre état, permettant à SwiftUI d'animer automatiquement les changements.

Il est utilisé en appliquant le modificateur .matchedGeometryEffect aux deux vues qui doivent être liées. Le modificateur prend trois paramètres:

1. id : Identifiant unique pour relier les vues.
2. in : Espace de noms (Namespace) où l'identifiant est enregistré. Généralement créé avec @Namespace.
3. properties : Ensemble de propriétés géométriques à animer (par exemple, .position, .size, .frame).

Exemple d'utilisation:

struct ContentView: View {
    @Namespace private var animation
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                Rectangle()
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "myShape", in: animation)
                    .frame(width: 200, height: 200)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            } else {
                Rectangle()
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "myShape", in: animation)
                    .frame(width: 50, height: 50)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            }
        }
    }
}

Dans cet exemple, .matchedGeometryEffect relie deux Rectangle avec le même id ("myShape") et dans le même espace de noms (animation). Lorsque isExpanded change, SwiftUI anime la transition entre les deux états, créant un effet fluide de changement de taille et de position du rectangle.