KeyframeTimeline
A description of how a value changes over time, modeled using keyframes.
Declaration
struct KeyframeTimeline<Value>Overview
Unlike other animations in SwiftUI (using Animation), keyframes don’t interpolate between from and to values that SwiftUI provides as state changes. Instead, keyframes fully define the path that a value takes over time using the tracks that make up their body.
Keyframes values are roughly analogous to video clips; they have a set duration, and you can scrub and evaluate them for any time within the duration.
The Keyframes structure also allows you to compute an interpolated value at a specific time, which you can use when integrating keyframes into custom use cases.
For example, you can use a Keyframes instance to define animations for a type conforming to Animatable:
let keyframes = KeyframeTimeline(initialValue: CGPoint.zero) {
CubicKeyframe(.init(x: 0, y: 100), duration: 0.3)
CubicKeyframe(.init(x: 0, y: 0), duration: 0.7)
}
let value = keyframes.value(time: 0.45)For animations that involve multiple coordinated changes, you can include multiple nested tracks:
struct Values {
var rotation = Angle.zero
var scale = 1.0
}
let keyframes = KeyframeTimeline(initialValue: Values()) {
KeyframeTrack(\.rotation) {
CubicKeyframe(.zero, duration: 0.2)
CubicKeyframe(.degrees(45), duration: 0.3)
}
KeyframeTrack(\.scale) {
CubicKeyframe(value: 1.2, duration: 0.5)
CubicKeyframe(value: 0.9, duration: 0.2)
CubicKeyframe(value: 1.0, duration: 0.3)
}
}Multiple nested tracks update the initial value in the order that they are declared. This means that if multiple nested plans change the same property of the root value, the value from the last competing track will be used.