Middle
Mis on matchedGeometryEffect ja kuidas seda SwiftUI-s kasutada?
sobes.tech AI
Vastus AI-lt
matchedGeometryEffect on SwiftUI modifikator, mis võimaldab sujuvalt animatsiooni muuta suurust ja asukohta vaate vahel, liikudes erinevate seisundite või hierarhiate vahel. See sünkroniseerib geomeetriat (suurust ja asukohta) erinevates hierarhia osades, luues "sobivuse" efekti.
Kasutamine:
-
idja animatsiooniruumi määratlemine:- Tuleb määrata unikaalne
idkõigile vaadetele, mis peavad olema sünkroniseeritud, kasutadesmatchedGeometryEffectmodifikatorit. - Määrata
namespace(nimede ruum).namespaceühendab vaated, mida tuleb koos animatsioonida. Tavaliselt kasutatakse annotatsiooni@Namespace private var namespace.
- Tuleb määrata unikaalne
-
Rakendamine vaadetele:
- Rakendada
matchedGeometryEffectiga vaadetele, mis osaleb animatsioonis, märkides samaidjanamespace. - Muuta vaadete nähtavust või asukohta, näiteks kasutades
if/elsetingimusi või muutudes olekut, mis mõjutab paigutust. SwiftUI automaatselt animatsioonib ülemineku.
- Rakendada
struct ContentView: View {
@Namespace private var animationNamespace // Nimede ruumi deklaratsioon
@State private var isExpanded = false
var body: some View {
VStack {
if isExpanded {
RoundedRectangle(cornerRadius: 10)
.fill(Color.blue)
.matchedGeometryEffect(id: "myShape", in: animationNamespace) // Kasutades id ja namespace
.frame(width: 300, height: 200)
} else {
RoundedRectangle(cornerRadius: 10)
.fill(Color.red)
.matchedGeometryEffect(id: "myShape", in: animationNamespace) // Sama id ja namespace
.frame(width: 50, height: 50)
}
Button("Toggle Size") {
withAnimation { // Kasutades withAnimation sujuvaks üleminekuks
isExpanded.toggle()
}
}
}
}
}
Peamised punktid:
- Sama
idjanamespacekasutamine võrdlevatel vaadetel. - Muutused peavad toimuma animatsiooni ploki sees (näiteks
withAnimation-ga). - Võimaldab luua keerukaid üleminekuid erinevate paigutusolekute vahel.
- Seda saab kasutada erinevate modifikatoritega, mis mõjutavad suurust ja asukohta (
frame,padding,offsetjne).
matchedGeometryEffect lihtsustab oluliselt keerukate vaate transformatsiooni animatsioonide loomist võrreldes käsitsi arvutamise ja raami parameetrite animatsiooniga.