1#![cfg_attr(target_family = "wasm", no_main)]
2
3use gpui::{
4 App, AppContext, Bounds, Context, Window, WindowBounds, WindowOptions, div, linear_color_stop,
5 linear_gradient, pattern_slash, prelude::*, px, rgb, size,
6};
7use gpui_platform::application;
8
9struct PatternExample;
10
11impl Render for PatternExample {
12 fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
13 div()
14 .flex()
15 .flex_col()
16 .gap_3()
17 .bg(rgb(0xffffff))
18 .size(px(600.0))
19 .justify_center()
20 .items_center()
21 .shadow_lg()
22 .text_xl()
23 .text_color(rgb(0x000000))
24 .child("Pattern Example")
25 .child(
26 div()
27 .flex()
28 .flex_col()
29 .border_1()
30 .border_color(gpui::blue())
31 .child(div().w(px(54.0)).h(px(18.0)).bg(pattern_slash(
32 gpui::red(),
33 18.0 / 4.0,
34 18.0 / 4.0,
35 )))
36 .child(div().w(px(54.0)).h(px(18.0)).bg(pattern_slash(
37 gpui::red(),
38 18.0 / 4.0,
39 18.0 / 4.0,
40 )))
41 .child(div().w(px(54.0)).h(px(18.0)).bg(pattern_slash(
42 gpui::red(),
43 18.0 / 4.0,
44 18.0 / 4.0,
45 )))
46 .child(div().w(px(54.0)).h(px(18.0)).bg(pattern_slash(
47 gpui::red(),
48 18.0 / 4.0,
49 18.0 / 2.0,
50 ))),
51 )
52 .child(
53 div()
54 .flex()
55 .flex_col()
56 .border_1()
57 .border_color(gpui::blue())
58 .bg(gpui::green().opacity(0.16))
59 .child("Elements the same height should align")
60 .child(div().w(px(256.0)).h(px(56.0)).bg(pattern_slash(
61 gpui::red(),
62 56.0 / 6.0,
63 56.0 / 6.0,
64 )))
65 .child(div().w(px(256.0)).h(px(56.0)).bg(pattern_slash(
66 gpui::green(),
67 56.0 / 6.0,
68 56.0 / 6.0,
69 )))
70 .child(div().w(px(256.0)).h(px(56.0)).bg(pattern_slash(
71 gpui::blue(),
72 56.0 / 6.0,
73 56.0 / 6.0,
74 )))
75 .child(div().w(px(256.0)).h(px(26.0)).bg(pattern_slash(
76 gpui::yellow(),
77 56.0 / 6.0,
78 56.0 / 6.0,
79 ))),
80 )
81 .child(
82 div()
83 .border_1()
84 .border_color(gpui::blue())
85 .w(px(240.0))
86 .h(px(40.0))
87 .bg(gpui::red()),
88 )
89 .child(
90 div()
91 .border_1()
92 .border_color(gpui::blue())
93 .w(px(240.0))
94 .h(px(40.0))
95 .bg(linear_gradient(
96 45.,
97 linear_color_stop(gpui::red(), 0.),
98 linear_color_stop(gpui::blue(), 1.),
99 )),
100 )
101 }
102}
103
104fn run_example() {
105 application().run(|cx: &mut App| {
106 let bounds = Bounds::centered(None, size(px(600.0), px(600.0)), cx);
107 cx.open_window(
108 WindowOptions {
109 window_bounds: Some(WindowBounds::Windowed(bounds)),
110 ..Default::default()
111 },
112 |_window, cx| cx.new(|_cx| PatternExample),
113 )
114 .unwrap();
115
116 cx.activate(true);
117 });
118}
119
120#[cfg(not(target_family = "wasm"))]
121fn main() {
122 run_example();
123}
124
125#[cfg(target_family = "wasm")]
126#[wasm_bindgen::prelude::wasm_bindgen(start)]
127pub fn start() {
128 gpui_platform::web_init();
129 run_example();
130}