Makepad's animation system is a declarative animation framework that manages UI animations through the concepts of States and Transitions.
Let's gain a deeper understanding of the entire system through a "typing" animation component.
Let's first look at the Animator's core data structure:
This structure appears simple but is actually a very elegant design:
live_ptr - Maintains reference to animation definition in Live DSL, allowing Animator to lookup and load animation state definitions when neededstate - Stores currently executing animation state, including all ongoing interpolation calculationsnext_frame - Used for scheduling the next animation frame renderThis system works based on state transitions:
[LiveId; 2])animate_to(): Smooth transition to new statecut_to(): Direct switch to new stateThe animation track (track) system allows for multiple properties to animate independently.