Šta je matchedGeometryEffect i kako ga koristiti u SwiftUI?

matchedGeometryEffect je modifikator u SwiftUI koji omogućava glatku animaciju promene veličine i položaja prikaza prilikom prelaska između različitih stanja ili hijerarhija prikaza. On sinhronizuje geometriju (veličinu i položaj) prikaza u različitim delovima hijerarhije, stvarajući efekat "podudaranja".

Upotreba:

1. Definisanje id i animacionog prostora:

   • Potrebno je dodeliti jedinstveni id svim prikazima koji treba da budu sinhronizovani, koristeći modifikator matchedGeometryEffect.
   • Navesti namespace (prostor imena animacije). namespace povezuje prikaze koji treba da se animiraju zajedno. Obično se koristi anotacija @Namespace private var namespace.

2. Primena na prikaze:

   • Primijeniti matchedGeometryEffect na svaki prikaz koji učestvuje u animaciji, navodeći isti id i namespace.
   • Menjati vidljivost ili položaj prikaza, na primer, koristeći uslove if/else ili menjajući stanje koje utiče na raspored. SwiftUI automatski animira prelaz.

struct ContentView: View {
    @Namespace private var animationNamespace // Deklaracija prostora imena
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // Primena sa id i namespace
                    .frame(width: 300, height: 200)
            } else {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // Primena sa istim id i namespace
                    .frame(width: 50, height: 50)
            }

            Button("Toggle Size") {
                withAnimation { // Korišćenje withAnimation za glatki prelaz
                    isExpanded.toggle()
                }
            }
        }
    }
}

Ključne tačke:

• Isti id i namespace za poređene prikaze.
• Promene treba da se dešavaju unutar bloka animacije (npr. sa withAnimation).
• Omogućava kreiranje složenih prelaza između različitih stanja rasporeda.
• Može se koristiti sa različitim modifikatorima koji utiču na veličinu i položaj (frame, padding, offset itd.).

matchedGeometryEffect znatno pojednostavljuje kreiranje složenih animacija transformacije prikaza u poređenju sa ručnim izračunavanjem i animacijom parametara okvira.