Struct UiRenderer

pub struct UiRenderer { /* private fields */ }

Implementations

impl UiRenderer

pub fn watch_shader_file(&mut self, path: &str)

Examples found in repository

examples/ui.rs (line 40)

    fn new(_config: Self::Config, mut deps: Self::Dependencies) -> anyhow::Result<Self> {
        deps.bloom.settings_mut().activated = false;
        deps.ui
            .ui_renderer
            .watch_shader_file("./src/modules/ui/ui.wgsl");

        Ok(MyApp {
            deps,
            ui: Board::new(dvec2(800.0, 800.0)),
        })
    }

examples/ui_image.rs (line 39)

    fn new(_config: Self::Config, mut deps: Self::Dependencies) -> anyhow::Result<Self> {
        deps.bloom.settings_mut().activated = false;
        deps.ui
            .ui_renderer
            .watch_shader_file("./src/modules/ui/ui.wgsl");

        let img_bytes = std::fs::read("assets/test.png").unwrap();
        let rgba = image::load_from_memory(&img_bytes).unwrap().to_rgba8();
        let texture = Texture::from_image(&deps.ctx.device, &deps.ctx.queue, &rgba);

        let bindable_texture = BindableTexture::new(&deps.ctx.device, texture);
        let image_texture = deps.arenas.insert(bindable_texture);

        Ok(MyApp {
            deps,
            ui: Board::new(dvec2(800.0, 800.0)),
            image_key: image_texture,
            value: 300.0,
        })
    }

pub fn draw_ui_board(&mut self, board: &Board)

Warning: only call AFTER layout has been performed for this frame. (needs to be BillboardPhase::Rendering) Assumes all rects and text layouts are calculated.

Examples found in repository

examples/ui_padding.rs (line 84)

    fn update(&mut self) {
        self.deps.gizmos.draw_xyz();
        self.deps
            .color_mesh
            .draw_cubes(&[Transform::new(1.0, 1.0, 1.0)], None);
        self.ui.start_frame(
            BoardInput::from_input_module(&self.deps.input),
            self.deps.ctx.size_dvec2(),
        );

        let mut parent = self.ui.add_div("Parent", None);
        parent.width(Len::PARENT);
        parent.height(Len::PARENT);
        parent.main_align = MainAlign::Center;
        parent.cross_align = Align::Center;
        parent.color = Color::RED;
        let parent = Some(parent.id);

        let mut rect = self.ui.add_div("rect", parent);
        rect.width(Len::px(400.0));
        rect.height(Len::px(400.0));
        rect.padding = Padding::new()
            .left(Len::px(50.0))
            .top(Len::px(50.0))
            .right(Len::parent(0.5));
        rect.color = Color::BLACK;
        rect.main_align = MainAlign::End;
        let rect = Some(rect.id);

        let mut inner = self.ui.add_div("inner", rect);
        inner.width(Len::PARENT);
        inner.height(Len::px(200.0));
        inner.color = Color::WHITE;

        self.ui.end_frame(&mut self.deps.ui.fonts);
        self.deps.ui.ui_renderer.draw_ui_board(&self.ui);
    }

examples/ui_image.rs (line 100)

    fn update(&mut self) {
        self.deps.gizmos.draw_xyz();
        self.deps
            .color_mesh
            .draw_cubes(&[Transform::new(1.0, 1.0, 1.0)], None);

        let size = self.deps.ctx.size;
        self.ui.start_frame(
            BoardInput::from_input_module(&self.deps.input),
            dvec2(size.width as f64, size.height as f64),
        );

        let mut parent = self.ui.add_div("Parent", None);
        parent.width(Len::PARENT);
        parent.height(Len::PARENT);
        parent.axis = Axis::X;
        parent.main_align = MainAlign::Center;
        parent.cross_align = Align::Center;
        // parent.color = Color::RED.alpha(0.0);
        let parent = Some(parent.id);

        // show some image in the UI
        let mut img = self.ui.add_div("img", parent);
        img.width(Len::px(200.0));
        img.height(Len::px(200.0));
        img.texture = Some(DivTexture {
            texture: self.image_key.key(),
            uv: Aabb::UNIT,
        });

        // sow the slider
        self.ui
            .add(Slider::new(&mut self.value, 0.0, 400.0), "slider", parent);

        self.ui.end_frame(&mut self.deps.ui.fonts);
        self.deps.ui.ui_renderer.draw_ui_board(&self.ui);

        // compare to Egui Widget (obviously a bit more polished)
        let mut egui = self.deps.egui.context();
        egui::Window::new("Value").show(&mut egui, |ui| {
            ui.add(egui::Slider::new(&mut self.value, 0.0..=400.0));
        });
        // std::thread::sleep(Duration::from_millis(150));
    }

examples/ui.rs (line 255)

    fn update(&mut self) {
        self.deps.gizmos.draw_xyz();
        self.deps
            .color_mesh
            .draw_cubes(&[Transform::new(1.0, 1.0, 1.0)], None);

        let size = self.deps.ctx.size;
        self.ui.start_frame(
            BoardInput::from_input_module(&self.deps.input),
            dvec2(size.width as f64, size.height as f64),
        );

        self.deps.world_rects.draw_textured_rect(
            UiRect {
                pos: Rect::new(0.0, 0.0, 1024.0, 1024.0),
                uv: Rect::UNIT,
                color: Color::WHITE,
                border_radius: Default::default(),
            },
            Transform::default(),
            self.deps.ui.fonts.atlas_texture(),
        );

        let mut parent = self.ui.add_div("Parent", None);

        parent.width(Len::PARENT);
        parent.axis = Axis::X;
        parent.main_align = MainAlign::SpaceBetween;
        parent.cross_align = Align::Center;
        parent.color = Color::RED.alpha(0.2);

        let parent = Some(parent.id);

        // let text = self.ui.add_text_div(
        //     DivProps::default(),
        //     DivStyle::default(),
        //     Text {
        //         color: Color::WHITE,
        //         string: "This is all the text that we need".into(),
        //         font: None,
        //         size: FontSize(80),
        //         offset_x: Len::ZERO,
        //         offset_y: Len::ZERO,
        //     },
        //     "sasass",
        //     Some(parent),
        // );

        // let text2 = self.ui.add_text_div(
        //     DivProps::default(),
        //     DivStyle::default(),
        //     Text {
        //         color: Color::RED,
        //         string: "This is some other text".into(),
        //         font: None,
        //         size: FontSize(20),
        //         offset_x: Len::ZERO,
        //         offset_y: Len::ZERO,
        //     },
        //     "asdsadsadsasdsad",
        //     Some(parent),
        // );

        let mut purp_parent = self.ui.add_div("Purple Parent", parent);
        purp_parent.width(Len::px(100.0));
        purp_parent.height(Len::px(200.0));
        purp_parent.axis = Axis::Y;
        purp_parent.main_align = MainAlign::Center;
        purp_parent.cross_align = Align::Center;
        purp_parent.color = Color::PURPLE.alpha(0.5);
        purp_parent.border_radius = BorderRadius::all(20.0);
        purp_parent.border_color = Color::GREEN;
        purp_parent.border_thickness = 6.0;
        purp_parent.border_softness = 1.0;
        let purp_parent = Some(purp_parent.id);

        let mut c1 = self.ui.add_div("child 1 in purple", purp_parent);
        c1.width(Len::px(50.0));
        c1.height(Len::px(50.0));
        c1.main_align = MainAlign::Center;
        c1.cross_align = Align::Center;
        c1.color = Color::GREEN;

        let mut c2 = self.ui.add_div("child 2 in purple", purp_parent);
        c2.width(Len::px(70.0));
        c2.height(Len::px(30.0));
        c2.main_align = MainAlign::Center;
        c2.cross_align = Align::Center;
        c2.color = Color::WHITE;

        let mut other = self.ui.add_div("other", parent);
        other.width(Len::px(100.0));
        other.height(Len::px(20.0));
        other.color = Color::BLACK;

        let mut text_div = self.ui.add_text_div(
            Text {
                color: Color::new(6.0, 2.0, 2.0),
                string: "Hover me please, I will show you something!".into(),
                size: FontSize(48),
                offset_x: Len::px(30.0),
                offset_y: Len::px(30.0),
                ..Default::default()
            },
            "text div",
            parent,
        );

        text_div.width(Len::px(300.0));
        text_div.height(Len::px(400.0));

        text_div.color = Color::YELLOW;
        text_div.border_radius = BorderRadius::all(20.0);
        text_div.border_thickness = 20.0;

        // can immediately edit the style and text without a 1-frame lag:
        // 1 frame lag only applies to the layout rect (DivProps) itself.
        if text_div.mouse_in_rect() {
            let style = text_div.style();
            style.color = Color::BLUE;
            style.border_color = Color::GREEN;
            style.border_thickness = 6.0;
            // style.border_radius = BorderRadius::new(40.0, 40.0, 40.0, 40.0);
            text_div.text().color = Color::BLACK;
        }

        let total_time = self.deps.time.total().as_secs_f64() * 4.0;
        let total_time2 = self.deps.time.total().as_secs_f64() * 9.7;
        if text_div.mouse_in_rect() {
            let mut green_square = self.ui.add_div(2112213232, parent);

            green_square.width(Len::px(40.0));
            green_square.height(Len::px(40.0));
            green_square.color = Color::GREEN;
            green_square.offset_x = Len::px(total_time.sin() * 20.0);
            green_square.offset_y = Len::px(total_time2.cos() * 20.0);
        }

        let mut container2 = self.ui.add_div("Container 2", parent);
        container2.height(Len::PARENT);
        container2.main_align = MainAlign::SpaceAround;
        container2.cross_align = Align::Center;

        let container2 = Some(container2.id);

        {
            let clicked = self
                .ui
                .add(
                    Button {
                        text: "Click".into(),
                        ..Default::default()
                    },
                    "my button",
                    container2,
                )
                .clicked;
            if clicked {
                println!("Hello 1");
            }
        }
        {
            let clicked = self
                .ui
                .add(
                    Button {
                        text: "Button 2".into(),
                        ..Default::default()
                    },
                    "my button 2",
                    container2,
                )
                .clicked;
            if clicked {
                println!("Hello 2");
            }
        }
        {
            let clicked = self
                .ui
                .add(
                    Button {
                        text: "Button 3".into(),
                        ..Default::default()
                    },
                    "my button 3",
                    container2,
                )
                .clicked;
            if clicked {
                println!("Hello 3");
            }
        }

        // let mut ctx = self.deps.egui.context();
        // egui_inspect_board(&mut ctx, &mut self.ui);

        self.ui.end_frame(&mut self.deps.ui.fonts);
        self.deps.ui.ui_renderer.draw_ui_board(&self.ui);
        // std::thread::sleep(Duration::from_millis(150));
    }

Trait Implementations

impl Module for UiRenderer

type Config = ()

Some initial data that configures the module. Provided by the User when adding a module to an app.

type Dependencies = Deps

Other modules that are expected to be part of the app. Provided automatically during app setup, where the program resolves which dependencies each module has.

fn new(_config: Self::Config, deps: Self::Dependencies) -> Result<Self>

creates this module

fn intialize(handle: Handle<Self>) -> Result<()>

Is run once, after all modules have been initialized. This function is optional, it is given a handle to the module itself. other modules can be accessed if you cache the handles to them in the new() function. E.g. the LineRenderer could register its own handle (Handle) with a general Renderer module, if a Handle<Renderer> was part of the Self::Dependencies and cached in the new function. E.g. LineRenderer could have a field renderer: Handle<Renderer> that is populated in new.

impl Prepare for UiRenderer

fn prepare( &mut self, device: &Device, queue: &Queue, _encoder: &mut CommandEncoder, )

impl SdrSurfaceRenderer for UiRenderer

fn render<'e>(&'e self, encoder: &'e mut CommandEncoder, view: &TextureView)