opacity.rs

  1use std::{fs, path::PathBuf, time::Duration};
  2
  3use anyhow::Result;
  4use gpui::{
  5    div, hsla, img, point, prelude::*, px, rgb, size, svg, App, Application, AssetSource, Bounds,
  6    BoxShadow, ClickEvent, Context, SharedString, Task, Timer, Window, WindowBounds, WindowOptions,
  7};
  8
  9struct Assets {
 10    base: PathBuf,
 11}
 12
 13impl AssetSource for Assets {
 14    fn load(&self, path: &str) -> Result<Option<std::borrow::Cow<'static, [u8]>>> {
 15        fs::read(self.base.join(path))
 16            .map(|data| Some(std::borrow::Cow::Owned(data)))
 17            .map_err(|e| e.into())
 18    }
 19
 20    fn list(&self, path: &str) -> Result<Vec<SharedString>> {
 21        fs::read_dir(self.base.join(path))
 22            .map(|entries| {
 23                entries
 24                    .filter_map(|entry| {
 25                        entry
 26                            .ok()
 27                            .and_then(|entry| entry.file_name().into_string().ok())
 28                            .map(SharedString::from)
 29                    })
 30                    .collect()
 31            })
 32            .map_err(|e| e.into())
 33    }
 34}
 35
 36struct HelloWorld {
 37    _task: Option<Task<()>>,
 38    opacity: f32,
 39}
 40
 41impl HelloWorld {
 42    fn new(_window: &mut Window, _: &mut Context<Self>) -> Self {
 43        Self {
 44            _task: None,
 45            opacity: 0.5,
 46        }
 47    }
 48
 49    fn change_opacity(&mut self, _: &ClickEvent, window: &mut Window, cx: &mut Context<Self>) {
 50        self.opacity = 0.0;
 51        cx.notify();
 52
 53        self._task = Some(cx.spawn_in(window, |view, mut cx| async move {
 54            loop {
 55                Timer::after(Duration::from_secs_f32(0.05)).await;
 56                let mut stop = false;
 57                let _ = cx.update(|_, cx| {
 58                    view.update(cx, |view, cx| {
 59                        if view.opacity >= 1.0 {
 60                            stop = true;
 61                            return;
 62                        }
 63
 64                        view.opacity += 0.1;
 65                        cx.notify();
 66                    })
 67                });
 68
 69                if stop {
 70                    break;
 71                }
 72            }
 73        }));
 74    }
 75}
 76
 77impl Render for HelloWorld {
 78    fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
 79        div()
 80            .flex()
 81            .flex_row()
 82            .size_full()
 83            .bg(rgb(0xe0e0e0))
 84            .text_xl()
 85            .child(
 86                div()
 87                    .flex()
 88                    .size_full()
 89                    .justify_center()
 90                    .items_center()
 91                    .border_1()
 92                    .text_color(gpui::blue())
 93                    .child(div().child("This is background text.")),
 94            )
 95            .child(
 96                div()
 97                    .id("panel")
 98                    .on_click(cx.listener(Self::change_opacity))
 99                    .absolute()
100                    .top_8()
101                    .left_8()
102                    .right_8()
103                    .bottom_8()
104                    .opacity(self.opacity)
105                    .flex()
106                    .justify_center()
107                    .items_center()
108                    .bg(gpui::white())
109                    .border_3()
110                    .border_color(gpui::red())
111                    .text_color(gpui::yellow())
112                    .child(
113                        div()
114                            .flex()
115                            .flex_col()
116                            .gap_2()
117                            .justify_center()
118                            .items_center()
119                            .size(px(300.))
120                            .bg(gpui::blue())
121                            .border_3()
122                            .border_color(gpui::black())
123                            .shadow(smallvec::smallvec![BoxShadow {
124                                color: hsla(0.0, 0.0, 0.0, 0.5),
125                                blur_radius: px(1.0),
126                                spread_radius: px(5.0),
127                                offset: point(px(10.0), px(10.0)),
128                            }])
129                            .child(img("image/app-icon.png").size_8())
130                            .child("Opacity Panel (Click to test)")
131                            .child(
132                                div()
133                                    .id("deep-level-text")
134                                    .flex()
135                                    .justify_center()
136                                    .items_center()
137                                    .p_4()
138                                    .bg(gpui::black())
139                                    .text_color(gpui::white())
140                                    .text_decoration_2()
141                                    .text_decoration_wavy()
142                                    .text_decoration_color(gpui::red())
143                                    .child(format!("opacity: {:.1}", self.opacity)),
144                            )
145                            .child(
146                                svg()
147                                    .path("image/arrow_circle.svg")
148                                    .text_color(gpui::black())
149                                    .text_2xl()
150                                    .size_8(),
151                            )
152                            .child("🎊✈️🎉🎈🎁🎂")
153                            .child(img("image/black-cat-typing.gif").size_12()),
154                    ),
155            )
156    }
157}
158
159fn main() {
160    Application::new()
161        .with_assets(Assets {
162            base: PathBuf::from(env!("CARGO_MANIFEST_DIR")).join("examples"),
163        })
164        .run(|cx: &mut App| {
165            let bounds = Bounds::centered(None, size(px(500.0), px(500.0)), cx);
166            cx.open_window(
167                WindowOptions {
168                    window_bounds: Some(WindowBounds::Windowed(bounds)),
169                    ..Default::default()
170                },
171                |window, cx| cx.new(|cx| HelloWorld::new(window, cx)),
172            )
173            .unwrap();
174            cx.activate(true);
175        });
176}