mirror of
https://github.com/griffi-gh/hUI.git
synced 2024-11-22 23:28:43 -06:00
134 lines
4.1 KiB
Rust
134 lines
4.1 KiB
Rust
//TODO: finish this demo
|
||
|
||
use hui::{
|
||
color, size,
|
||
draw::{ImageHandle, TextureFormat},
|
||
layout::{Alignment, Direction},
|
||
rect::Sides,
|
||
element::{
|
||
container::Container,
|
||
fill_rect::FillRect,
|
||
image::Image,
|
||
text::Text,
|
||
UiElementExt
|
||
},
|
||
};
|
||
|
||
#[path = "../boilerplate.rs"]
|
||
#[macro_use]
|
||
mod boilerplate;
|
||
|
||
struct Stuff {
|
||
vscode_icon: ImageHandle,
|
||
}
|
||
|
||
ui_main!(
|
||
"hUI: vscode demo",
|
||
init: |ui| {
|
||
let handle = ui.add_font(include_bytes!("../assets/fira/FiraSans-Light.ttf"));
|
||
ui.push_font(handle);
|
||
Stuff {
|
||
vscode_icon: ui.add_image(TextureFormat::Rgba, include_bytes!("../assets/icons/visual-studio-code-icon_32x32.rgba"), 32),
|
||
}
|
||
},
|
||
run: |ui, size, stuff| {
|
||
Container::default()
|
||
.with_size(size!(100%))
|
||
.with_children(|ui| {
|
||
Container::default()
|
||
.with_size(size!(100%, auto))
|
||
.with_direction(Direction::Horizontal)
|
||
.with_align((Alignment::Begin, Alignment::Center))
|
||
.with_padding(Sides {
|
||
left: 5.,
|
||
right: 0.,
|
||
top: 5.,
|
||
bottom: 5.,
|
||
})
|
||
.with_gap(15.)
|
||
.with_background(color::rgb_hex(0x3d3c3e))
|
||
.with_wrap(true) //XXX: not authentic but great for demostration
|
||
.with_children(|ui| {
|
||
Image::new(stuff.vscode_icon)
|
||
.with_size(size!(auto, 24))
|
||
.add_child(ui);
|
||
for item in ["File", "Edit", "Selection", "View", "Go", "Run", "Terminal", "Help"] {
|
||
Text::new(item)
|
||
.with_text_size(15)
|
||
.add_child(ui);
|
||
}
|
||
Container::default()
|
||
//HACK: due to a bug in the layout system, 100%= doesn't work as expected
|
||
.with_size(size!(94%=, 100%))
|
||
.with_align((Alignment::End, Alignment::Center))
|
||
.with_children(|ui| {
|
||
Text::new("- ×")
|
||
.with_text_size(32)
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
FillRect::default()
|
||
.with_size(size!(100%, 1))
|
||
.with_frame(color::rgb_hex(0x2d2d30))
|
||
.add_child(ui);
|
||
Container::default()
|
||
.with_size(size!(100%, 100%=))
|
||
.with_direction(Direction::Horizontal)
|
||
.with_children(|ui| {
|
||
// Sidebar:
|
||
Container::default()
|
||
.with_size(size!(54, 100%))
|
||
.with_background(color::rgb_hex(0x343334))
|
||
.add_child(ui);
|
||
FillRect::default()
|
||
.with_size(size!(1, 100%))
|
||
.with_frame(color::rgb_hex(0x2d2d30))
|
||
.add_child(ui);
|
||
|
||
// Explorer pane:
|
||
Container::default()
|
||
.with_size(size!(200, 100%))
|
||
.with_padding((15., 8.))
|
||
.with_background(color::rgb_hex(0x262526))
|
||
.with_children(|ui| {
|
||
Text::new("EXPLORER")
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
|
||
// "Code" pane
|
||
Container::default()
|
||
.with_size(size!(100%=, 100%))
|
||
.with_background(color::rgb_hex(0x1f1e1f))
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
|
||
//Status bar
|
||
Container::default()
|
||
.with_size(size!(100%, auto))
|
||
.with_background(color::rgb_hex(0x0079cc))
|
||
.with_direction(Direction::Horizontal)
|
||
.with_gap(5.)
|
||
.with_children(|ui| {
|
||
Container::default()
|
||
.with_background(color::rgb_hex(0x16815e))
|
||
.with_padding((10., 2.))
|
||
.with_children(|ui| {
|
||
Text::new("><")
|
||
.with_text_size(13)
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
Text::new("master")
|
||
.with_text_size(15)
|
||
.add_child(ui);
|
||
})
|
||
.add_child(ui);
|
||
})
|
||
.add_root(ui, size);
|
||
}
|
||
);
|