Sobes.tech
Middle

Mi az a matchedGeometryEffect a SwiftUI-ben?

sobes.tech MI

Válasz az MI-től

A matchedGeometryEffect SwiftUI-ban egy módosító, amely lehetővé teszi a nézetek méretének és helyzetének sima animálását azok között a hierarchiák vagy konténerek között történő mozgatás során.

Alapelvek:

  • Azonosítók egyeztetése: Megadod ugyanazt az id-t azokhoz a nézetekhez, amelyeket animálni szeretnél a váltás során.
  • Forrás és cél: Meghatározol egy namespace-t (névtér), amely összeköti ezeket a nézeteket.
  • Automatikus animáció: A SwiftUI automatikusan kiszámítja a közbenső állapotokat, és animálja a váltást egyik állapotból a másikba.

Alkalmazás:

import SwiftUI

struct ContentView: View {
    @Namespace private var namespace
    @State private var isExpanded = false

    var body: some View {
        VStack {
            if isExpanded {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.blue)
                    .matchedGeometryEffect(id: "box", in: namespace)
                    .frame(width: 200, height: 200)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            } else {
                RoundedRectangle(cornerRadius: 5)
                    .fill(Color.red)
                    .matchedGeometryEffect(id: "box", in: namespace)
                    .frame(width: 50, height: 50)
                    .onTapGesture {
                        withAnimation {
                            isExpanded.toggle()
                        }
                    }
            }
        }
    }
}

Ebben a példában a RoundedRectangle mérete és színe változik az isExpanded állapotok között váltva, a matchedGeometryEffect-tel az `