Czym jest matchedGeometryEffect w SwiftUI?

matchedGeometryEffect w SwiftUI to modyfikator, który pozwala na płynne animowanie zmiany rozmiaru i położenia widoków podczas ich przemieszczania się między różnymi hierarchiami lub kontenerami.

Podstawowe zasady:

• Dopasowanie identyfikatorów: Podajesz ten sam identyfikator (id) dla widoków, które chcesz animować podczas przejścia.
• Źródło i cel: Określasz przestrzeń nazw (namespace), która łączy te widoki.
• Automatyczna animacja: SwiftUI automatycznie oblicza stany pośrednie i animuje przejście z jednego stanu do drugiego.

Zastosowanie:

import SwiftUI

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

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "box", in: namespace)
                    .frame(width: 200, height: 200)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            } else {
                RoundedRectangle(cornerRadius: 5)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "box", in: namespace)
                    .frame(width: 50, height: 50)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            }
        }
    }
}

W tym przykładzie, RoundedRectangle zmienia rozmiar i kolor podczas przełączania między stanami isExpanded, używając matchedGeometryEffect z identyfikatorem "box" i przestrzenią nazw namespace. SwiftUI automatycznie animuje tę zmianę.