Custom AnimatableModifier and Animatable
Animating custom drawn content by conforming to Animatable and AnimatableModifier.
The Animatable Protocol
Animatable tells SwiftUI how to interpolate a type during animation. Shapes conform to it automatically.
struct Wave: Shape, Animatable {
var amplitude: Double
var animatableData: Double {
get { amplitude }
set { amplitude = newValue }
}
func path(in rect: CGRect) -> Path { Path() }
}animatableData Property
SwiftUI reads and writes animatableData at each animation frame to interpolate between start and end values.
struct GrowingCircle: Shape {
var radius: Double
var animatableData: Double {
get { radius }
set { radius = newValue }
}
func path(in rect: CGRect) -> Path {
Path(ellipseIn: CGRect(x: rect.midX-radius, y: rect.midY-radius, width: radius*2, height: radius*2))
}
}All lessons in this course
- Implicit vs Explicit Animations
- matchedGeometryEffect for Hero Transitions
- Custom AnimatableModifier and Animatable
- TimelineView and Canvas for High-Performance Drawing