matchedGeometryEffect nədir və onu SwiftUI-də necə istifadə etmək olar?

matchedGeometryEffect SwiftUI-də istifadə olunan bir modifierdir və bu, müxtəlif vəziyyətlər və ya görünüm hierarxiyaları arasında görünümün ölçüsü və mövqeyinin hamar animasiyasını təmin edir. Bu, hierarxiyanın müxtəlif hissələrindəki görünümlərin geometriyasını (ölçü və mövqe) sinxronlaşdırır və "uyğunlaşma" effektini yaradır.

İstifadə:

1. id və animasiya sahəsinin təyin edilməsi:

   • Sinxronlaşdırılmalı olan bütün görünümlərə unikal id təyin edin və matchedGeometryEffect modifierindən istifadə edin.
   • namespace (ad məkanı) göstərin. namespace birlikdə animasiya olunacaq görünümləri bağlayır. Adətən, @Namespace private var namespace annotasiyası istifadə olunur.

2. Görünümlərə tətbiq:

   • Hər bir iştirak edən görünümə matchedGeometryEffect tətbiq edin və eyni id və namespace göstərin.
   • Görünümlərin görünürlüğünü və ya mövqeyini dəyişdirin, məsələn, if/else şərtlərindən və ya vəziyyəti dəyişdirərək. SwiftUI avtomatik olaraq keçidi animasiya edir.

struct ContentView: View {
    @Namespace private var animationNamespace // Ad məkanının elan olunması
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // id və namespace ilə tətbiq
                    .frame(width: 300, height: 200)
            } else {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // eyni id və namespace ilə tətbiq
                    .frame(width: 50, height: 50)
            }

            Button("Toggle Size") {
                withAnimation { // Yumuşaq keçid üçün withAnimation istifadə edin
                    isExpanded.toggle()
                }
            }
        }
    }
}

Əsas nöqtələr:

• Eyni id və namespace uyğun görünüşlər üçün.
• Dəyişikliklər animasiya blokunda olmalıdır (məsələn, withAnimation ilə).
• Çətin keçidlər yaratmağa imkan verir.
• Ölçü və mövqeyə təsir edən müxtəlif modifierlər ilə istifadə edilə bilər (frame, padding, offset və s.).

matchedGeometryEffect görünüşlərin çevrilmə animasiyalarını əl ilə hesablamadan və animasiya etmədən çox asanlaşdırır.