grid/
grid.rs

1use motion_canvas_rs::prelude::*;
2use std::time::Duration;
3
4fn main() {
5    let mut project = Project::default()
6        .with_title("Grid Example")
7        .with_dimensions(1280, 720)
8        .close_on_finish();
9
10    // 1. Create Grid Node
11    let grid = GridNode::square(Vec2::new(640.0, 360.0), 4.0, 50.0)
12        .with_stroke(Palette::DARK_GRAY, 2.0)
13        .with_opacity(0.0);
14
15    // 2. Create Text Node
16    let text_node = TextNode::default()
17        .with_position(Vec2::new(640.0, 100.0))
18        .with_font_size(36.0)
19        .with_fill(Color::WHITE)
20        .with_text("Grid: 4x4 | Spacing: 50x50");
21
22    // 3. Bind Text to Grid's rows/columns and spacing
23    let cols_sig = grid.columns.clone();
24    let spacing_sig = grid.spacing.clone();
25    let text_link = text_node.text.bind(grid.rows.clone(), move |rows| {
26        let cols = cols_sig.get();
27        let spacing = spacing_sig.get();
28        format!(
29            "Grid: {:.0}x{:.0} | Spacing: {:.0}x{:.0}",
30            cols, rows, spacing.x, spacing.y
31        )
32    });
33
34    // Add to scene
35    project.scene.add(Box::new(grid.clone()));
36    project.scene.add(Box::new(text_node));
37    project.scene.add(Box::new(text_link));
38
39    project.scene.video_timeline.add(chain![
40        grid.opacity
41            .to(1.0, Duration::from_secs(1))
42            .ease(easings::cubic_out),
43        wait(Duration::from_millis(500)),
44        all![
45            grid.rows.to(16.0, Duration::from_secs(2)),
46            grid.columns.to(16.0, Duration::from_secs(2)),
47            grid.stroke_color.to(Palette::BLUE, Duration::from_secs(2)),
48            grid.spacing
49                .to(Vec2::new(100.0, 100.0), Duration::from_secs(2)),
50        ],
51        wait(Duration::from_millis(500)),
52        all![
53            grid.rows.to(8.0, Duration::from_secs(2)),
54            grid.columns.to(8.0, Duration::from_secs(2)),
55            grid.stroke_color
56                .to(Palette::ORANGE, Duration::from_secs(2)),
57            grid.spacing
58                .to(Vec2::new(20.0, 20.0), Duration::from_secs(2)),
59        ],
60        wait(Duration::from_secs(1)),
61        grid.opacity
62            .to(0.0, Duration::from_secs(1))
63            .ease(easings::cubic_out),
64        wait(Duration::from_millis(500)),
65    ]);
66
67    project.show().expect("Failed to render");
68}
grid/grid.rs

grid/
grid.rs
