Sobes.tech
Middle+

Czym jest matchedGeometryEffect i jak jest używany w SwiftUI?

sobes.tech AI

Odpowiedź od AI

matchedGeometryEffect w SwiftUI służy do tworzenia płynnej animacji przejścia między dwoma widokami, które reprezentują ten sam element wizualny w różnych układach. Łączy geometrię widoku w jednym stanie z geometrią innego widoku w innym stanie, umożliwiając SwiftUI automatyczne animowanie zmian.

Używa się go, stosując modyfikator .matchedGeometryEffect do obu widoków, które mają być powiązane. Modyfikator przyjmuje trzy parametry:

  1. id: Unikalny identyfikator do powiązania widoków.
  2. in: Przestrzeń nazw (Namespace), w której zarejestrowany jest identyfikator. Zazwyczaj tworzony za pomocą @Namespace.
  3. properties: Zbiór właściwości geometrycznych, które mają być animowane (np. .position, .size, .frame).

Przykład użycia:

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()
                        }
                    }
            }
        }
    }
}

W tym przykładzie .matchedGeometryEffect łączy dwa Rectangle z tym samym id ("myShape") i w tym samym zakresie nazw (animation). Gdy isExpanded się zmienia, SwiftUI animuje przejście między dwoma stanami, tworząc efekt płynnej zmiany rozmiaru i położenia prostokąta.