← circus
Compound animation
Generate coordinated keystates for multiple elements
Python Code
from vood import animation
from vood.transition import easing
from vood.component import TextRenderer, TextState
from vood.converter.converter_type import ConverterType
from vood.core.logger import configure_logging
from vood.velement import VElement
from vood.vscene import VScene
from vood.vscene.vscene_exporter import VSceneExporter
from vood.core.color import Color
configure_logging(level="INFO")
START_COLOR = Color("#FDBE02")
END_COLOR = Color("#AA0000")
def main():
# Create the scene
scene = VScene(width=64, height=64, background=Color("#000017"))
# Create text states for each number with consistent styling
# These states will be the starting point of the animation
states = [
TextState(
text=text,
font_family="Courier New",
font_size=42,
)
for text in ["Empty", "Mirror"]
]
fade_keyframes = animation.compound.slide_replace(
state1=states[0],
state2=states[1],
at_time=0.5,
duration=0.4,
distance=100,
direction=animation.compound.SlideDirection.UP,
extend_timeline=True,
)
renderer = TextRenderer()
opacity_easing = (easing.in_cubic, easing.out_cubic)
elements = [
VElement(
renderer=renderer,
keystates=keystates,
property_keystates={"fill_color": [START_COLOR, END_COLOR]},
property_easing={"opacity": opacity_easing[i]},
)
for i, keystates in enumerate(fade_keyframes)
]
scene.add_elements(elements)
# Create the exporter
exporter = VSceneExporter(
scene=scene,
converter=ConverterType.PLAYWRIGHT,
output_dir="output/",
)
# Export to mp4
exporter.to_mp4(
filename="compound_animation",
total_frames=150,
framerate=30,
png_width_px=1024,
)
if __name__ == "__main__":
main()
Remarks
- Compound animation generate keystates for multiple elements to orchestrate more complex animation.