Sobes.tech
Middle+

Какво е matchedGeometryEffect и как се използва в SwiftUI?

sobes.tech AI

Отговор от AI

matchedGeometryEffect в SwiftUI се използва за създаване на плавна анимация на преход между две визуализации, които представляват един и същи визуален елемент в различни оформления. Той свързва геометрията на визуализацията в едно състояние с геометрията на друга визуализация в друго състояние, позволявайки на SwiftUI автоматично да анимира промените.

Използва се чрез прилагане на модификатора .matchedGeometryEffect към двете визуализации, които трябва да бъдат свързани. Модификаторът приема три параметъра:

  1. id: Уникален идентификатор за свързване на визуализациите.
  2. in: Име пространство (Namespace), в което е регистриран идентификаторът. Обикновено се създава с @Namespace.
  3. properties: Набор от геометрични свойства, които трябва да бъдат анимирани (например, .position, .size, .frame).

Пример за използване:

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

В този пример, .matchedGeometryEffect свързва два Rectangle с един и същ id ("myShape") и в едно и също пространство от имена (animation). Когато isExpanded се променя, SwiftUI анимира прехода между двата състояния, създавайки плавен ефект на промяна на размера и позицията на правоъгълника.