Sobes.tech
Middle

matchedGeometryEffect чист ва чӣ тавр дар SwiftUI истифода бурда мешавад?

sobes.tech AI

Ҷавоб аз AI

matchedGeometryEffect — این یک اصلاح‌کننده در SwiftUI است که اجازه می‌دهد تغییر اندازه و موقعیت نمایه‌سازی را در حین انتقال بین حالت‌ها یا سلسله‌مراتب‌های مختلف نمایه‌ها به صورت نرم و روان انجام دهد. این ویژگی هندسه (اندازه و موقعیت) نمایه‌ها را در بخش‌های مختلف سلسله‌مراتب همگام می‌کند و اثر "هم‌خوانی" را ایجاد می‌کند.

استفاده:

  1. تعریف id و فضای انیمیشن:

    • باید یک id منحصر به فرد به تمام نمایه‌هایی که باید همگام شوند اختصاص دهید، با استفاده از اصلاح‌کننده matchedGeometryEffect.
    • مشخص کردن namespace (فضای نام انیمیشن). namespace نمایه‌هایی را که باید با هم انیمیشن شوند، مرتبط می‌کند. معمولاً از اعلانیه @Namespace private var namespace استفاده می‌شود.
  2. اعمال بر روی نمایه‌ها:

    • اعمال matchedGeometryEffect بر هر نمایه که در انیمیشن شرکت دارد، با ذکر همان id و namespace.
    • تغییر دید یا موقعیت نمایه‌ها، مثلاً با استفاده از شرایط if/else یا تغییر وضعیت که بر چیدمان تأثیر می‌گذارد. SwiftUI به طور خودکار انتقال را انیمیت می‌کند.
struct ContentView: View {
    @Namespace private var animationNamespace // اعلام فضای نام
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // استفاده با id و namespace
                    .frame(width: 300, height: 200)
            } else {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "myShape", in: animationNamespace) // استفاده با همان id و namespace
                    .frame(width: 50, height: 50)
            }

            Button("Toggle Size") {
                withAnimation { // استفاده از withAnimation برای انتقال نرم
                    isExpanded.toggle()
                }
            }
        }
    }
}

نکات کلیدی:

  • همان id و namespace برای نمایه‌های مقایسه‌شده.
  • تغییرات باید در داخل بلوک انیمیشن انجام شوند (مثلاً با withAnimation).
  • امکان ایجاد انتقال‌های پیچیده بین حالت‌های مختلف چیدمان.
  • می‌توان از آن با اصلاح‌کننده‌های مختلف که بر اندازه و موقعیت تأثیر می‌گذارند، استفاده کرد (frame، padding، offset و غیره).

matchedGeometryEffect به طور قابل توجهی فرآیند ساخت انیمیشن‌های پیچیده تبدیل نمایه‌ها را نسبت به محاسبات دستی و انیمیشن پارامترهای فریم ساده‌تر می‌کند.