Kas yra matchedGeometryEffect ir kaip jį naudoti SwiftUI?

matchedGeometryEffect yra SwiftUI modifikatorius, leidžiantis sklandžiai animuoti vaizdo dydžio ir padėties pokyčius pereinant tarp skirtingų būsenų ar hierarchijų. Jis sinchronizuoja geometriją (dydį ir padėtį) skirtingose hierarchijos dalyse, sukurdami "atitikties" efektą.

Naudojimas:

1. id ir animacijos srities apibrėžimas:

   • Priskirti unikalų id visiems vaizdams, kurie turi būti sinchronizuoti, naudojant matchedGeometryEffect modifikatorių.
   • Nurodyti namespace (animacijos vardų sritį). namespace sujungia vaizdus, kurie turi būti animuojami kartu. Paprastai naudojama anotacija @Namespace private var namespace.

2. Taikymas vaizdams:

   • Taikyti matchedGeometryEffect kiekvienam vaizdui, kuris dalyvauja animacijoje, nurodant tą patį id ir namespace.
   • Keisti vaizdų matomumą ar padėtį, pvz., naudojant if/else sąlygas arba keičiant būseną, kuri veikia išdėstymą. SwiftUI automatiškai animuoja perėjimą.

struct ContentView: View {
    @Namespace private var animationNamespace // Vardo srities deklaravimas
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // Naudojimas su id ir namespace
                    .frame(width: 300, height: 200)
            } else {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // Naudojimas su tuo pačiu id ir namespace
                    .frame(width: 50, height: 50)
            }

            Button("Toggle Size") {
                withAnimation { // Naudojimas suAnimation sklandžiam perėjimui
                    isExpanded.toggle()
                }
            }
        }
    }
}

Pagrindinės pastabos:

• Toks pat id ir namespace naudojami lyginamiems vaizdams.
• Pokyčiai turi įvykti animacijos bloko viduje (pvz., su withAnimation).
• Leidžia kurti sudėtingus perėjimus tarp skirtingų išdėstymo būsenų.
• Gali būti naudojamas su įvairiais modifikatoriais, kurie veikia dydį ir padėtį (frame, padding, offset ir kt.).

matchedGeometryEffect žymiai supaprastina sudėtingų vaizdo transformacijos animacijų kūrimą, palyginti su rankiniu būdu skaičiuojant ir animuojant rėmo parametrus.