Skip to main content

wisp_storybook/stories/
s_clip_rounded.rs

1//! Story: rounded-rect clip foundation (M-MASK.1 / AUT-31).
2//!
3//! A solid-color graphics primitive fills the whole NDC viewport.
4//! A `Container` wraps it with `clip = MaskShape::RoundedRect(...)`,
5//! producing the "cinematic recording-quad crop" shape the recorder
6//! will use for its primary screen-capture surface.
7
8use wisp::application::Application;
9use wisp::math::Rect;
10use wisp::{Color, Container, Fill, Graphics, MaskShape, Node, Stage};
11
12use crate::story::Story;
13
14pub fn story() -> Story {
15    Story {
16        id: "clip-rounded",
17        category: "Mask",
18        title: "Rounded crop foundation",
19        milestone: "M-MASK.1 / AUT-31",
20        writeup: include_str!("writeups/clip_rounded.md"),
21        build,
22        tick: None,
23    }
24}
25
26fn build(_app: &Application, stage: &mut Stage) {
27    // Backdrop graphics — gradient panel so the rounded edge is
28    // visible against a varying color.
29    let mut bg = Graphics::new();
30    bg.fill(Fill::LinearGradient {
31        start: glam::Vec2::new(0.0, 1.0),
32        end: glam::Vec2::new(0.0, -1.0),
33        color_a: Color::rgba_u8(40, 50, 70, 255),
34        color_b: Color::rgba_u8(20, 25, 35, 255),
35    });
36    bg.draw_rect(Rect::new(-1.0, -1.0, 2.0, 2.0));
37    let _ = stage.add_child(stage.root(), bg);
38
39    // The clipped container — anything inside it is rounded-cropped.
40    let mut clip_container = Container::new();
41    clip_container.clip = Some(MaskShape::RoundedRect {
42        rect: Rect::new(-0.75, -0.55, 1.5, 1.1),
43        radius: 0.14,
44    });
45    let clip_id = stage
46        .add_child(stage.root(), Node::Container(clip_container))
47        .expect("clip container");
48
49    // The "recording surface" — a checkered pattern that shows the
50    // crop is honoring the rounded corners.
51    let mut recording = Graphics::new();
52    recording.fill(Fill::LinearGradient {
53        start: glam::Vec2::new(-1.0, 0.0),
54        end: glam::Vec2::new(1.0, 0.0),
55        color_a: Color::rgba_u8(180, 200, 230, 255),
56        color_b: Color::rgba_u8(255, 200, 100, 255),
57    });
58    recording.draw_rect(Rect::new(-1.0, -1.0, 2.0, 2.0));
59    let _ = stage.add_child(clip_id, recording);
60}