diff --git a/emigui/src/collapsing_header.rs b/emigui/src/collapsing_header.rs index f501c6e2..d50f48c8 100644 --- a/emigui/src/collapsing_header.rs +++ b/emigui/src/collapsing_header.rs @@ -49,7 +49,7 @@ impl CollapsingHeader { let text_style = TextStyle::Button; let font = ®ion.fonts()[text_style]; let (title, text_size) = font.layout_multiline(&title, region.available_width()); - let text_cursor = region.cursor + region.style.button_padding; + let interact = region.reserve_space( vec2( region.available_width(), @@ -81,7 +81,10 @@ impl CollapsingHeader { paint_icon(region, &state, &interact); region.add_text( - text_cursor + vec2(region.style.start_icon_width, 0.0), + pos2( + interact.rect.left() + region.style.indent, + interact.rect.center().y - text_size.y / 2.0, + ), text_style, title, Some(region.style.interact_stroke_color(&interact)), @@ -131,7 +134,12 @@ fn paint_icon(region: &mut Region, state: &State, interact: &InteractInfo) { let stroke_color = region.style.interact_stroke_color(&interact); let stroke_width = region.style.interact_stroke_width(&interact); - let (small_icon_rect, _) = region.style.icon_rectangles(&interact.rect); + let (mut small_icon_rect, _) = region.style.icon_rectangles(&interact.rect); + small_icon_rect.set_center(pos2( + interact.rect.left() + region.style.indent / 2.0, + interact.rect.center().y, + )); + // Draw a minus: region.add_paint_cmd(PaintCmd::Line { points: vec![ diff --git a/emigui/src/layout.rs b/emigui/src/layout.rs index 1140754a..bd40d189 100644 --- a/emigui/src/layout.rs +++ b/emigui/src/layout.rs @@ -82,13 +82,13 @@ impl Default for Align { pub fn align_rect(rect: Rect, align: (Align, Align)) -> Rect { let x = match align.0 { Align::Min => rect.left(), - Align::Center => rect.left() - 0.5 * rect.size().x, - Align::Max => rect.left() - rect.size().x, + Align::Center => rect.left() - 0.5 * rect.width(), + Align::Max => rect.left() - rect.width(), }; let y = match align.1 { Align::Min => rect.top(), - Align::Center => rect.top() - 0.5 * rect.size().y, - Align::Max => rect.top() - rect.size().y, + Align::Center => rect.top() - 0.5 * rect.height(), + Align::Max => rect.top() - rect.height(), }; Rect::from_min_size(pos2(x, y), rect.size()) } diff --git a/emigui/src/math.rs b/emigui/src/math.rs index 8055712c..6c93d460 100644 --- a/emigui/src/math.rs +++ b/emigui/src/math.rs @@ -343,16 +343,21 @@ impl Rect { } } - // keep min + /// keep min pub fn set_width(&mut self, w: f32) { self.max.x = self.min.x + w; } - // keep min + /// keep min pub fn set_height(&mut self, h: f32) { self.max.y = self.min.y + h; } + /// Keep size + pub fn set_center(&mut self, center: Pos2) { + *self = self.translate(center - self.center()); + } + pub fn contains(&self, p: Pos2) -> bool { self.min.x <= p.x && p.x <= self.min.x + self.size().x diff --git a/emigui/src/region.rs b/emigui/src/region.rs index fc9e512c..ccc0c174 100644 --- a/emigui/src/region.rs +++ b/emigui/src/region.rs @@ -182,7 +182,7 @@ impl Region { let size = child_region.bounding_size; // draw a grey line on the left to mark the region - let line_start = child_rect.min() - indent + vec2(13.0, 2.0); + let line_start = child_rect.min() - indent * 0.5; let line_start = line_start.round(); let line_end = pos2(line_start.x, line_start.y + size.y - 8.0); self.add_paint_cmd(PaintCmd::Line { diff --git a/emigui/src/style.rs b/emigui/src/style.rs index 62b34894..c0dfee32 100644 --- a/emigui/src/style.rs +++ b/emigui/src/style.rs @@ -45,8 +45,8 @@ impl Default for Style { button_padding: vec2(5.0, 3.0), item_spacing: vec2(8.0, 4.0), indent: 21.0, - clickable_diameter: 28.0, - start_icon_width: 20.0, + clickable_diameter: 22.0, + start_icon_width: 16.0, line_width: 1.0, animation_time: 1.0 / 20.0, window: Window::default(), @@ -132,9 +132,9 @@ impl Style { /// Returns small icon rectangle and big icon rectangle pub fn icon_rectangles(&self, rect: &Rect) -> (Rect, Rect) { - let box_side = 16.0; + let box_side = self.start_icon_width; let big_icon_rect = Rect::from_center_size( - pos2(rect.left() + 4.0 + box_side * 0.5, rect.center().y), + pos2(rect.left() + box_side / 2.0, rect.center().y), vec2(box_side, box_side), ); @@ -145,20 +145,23 @@ impl Style { } impl Style { + #[rustfmt::skip] pub fn ui(&mut self, region: &mut crate::Region) { use crate::widgets::{Button, Slider}; if region.add(Button::new("Reset style")).clicked { *self = Default::default(); } - region.add(Slider::f32(&mut self.item_spacing.x, 0.0, 10.0).text("item_spacing.x")); - region.add(Slider::f32(&mut self.item_spacing.y, 0.0, 10.0).text("item_spacing.y")); - region.add(Slider::f32(&mut self.window_padding.x, 0.0, 10.0).text("window_padding.x")); - region.add(Slider::f32(&mut self.window_padding.y, 0.0, 10.0).text("window_padding.y")); - region.add(Slider::f32(&mut self.indent, 0.0, 100.0).text("indent")); - region.add(Slider::f32(&mut self.button_padding.x, 0.0, 20.0).text("button_padding.x")); - region.add(Slider::f32(&mut self.button_padding.y, 0.0, 20.0).text("button_padding.y")); - region.add(Slider::f32(&mut self.clickable_diameter, 0.0, 60.0).text("clickable_diameter")); - region.add(Slider::f32(&mut self.start_icon_width, 0.0, 60.0).text("start_icon_width")); - region.add(Slider::f32(&mut self.line_width, 0.0, 10.0).text("line_width")); + + + region.add(Slider::f32(&mut self.item_spacing.x, 0.0, 10.0).text("item_spacing.x").precision(0)); + region.add(Slider::f32(&mut self.item_spacing.y, 0.0, 10.0).text("item_spacing.y").precision(0)); + region.add(Slider::f32(&mut self.window_padding.x, 0.0, 10.0).text("window_padding.x").precision(0)); + region.add(Slider::f32(&mut self.window_padding.y, 0.0, 10.0).text("window_padding.y").precision(0)); + region.add(Slider::f32(&mut self.indent, 0.0, 100.0).text("indent").precision(0)); + region.add(Slider::f32(&mut self.button_padding.x, 0.0, 20.0).text("button_padding.x").precision(0)); + region.add(Slider::f32(&mut self.button_padding.y, 0.0, 20.0).text("button_padding.y").precision(0)); + region.add(Slider::f32(&mut self.clickable_diameter, 0.0, 60.0).text("clickable_diameter").precision(0)); + region.add(Slider::f32(&mut self.start_icon_width, 0.0, 60.0).text("start_icon_width").precision(0)); + region.add(Slider::f32(&mut self.line_width, 0.0, 10.0).text("line_width").precision(0)); } } diff --git a/emigui/src/widgets.rs b/emigui/src/widgets.rs index ca157543..df186967 100644 --- a/emigui/src/widgets.rs +++ b/emigui/src/widgets.rs @@ -228,7 +228,7 @@ impl Widget for RadioButton { center: big_icon_rect.center(), fill_color, outline: None, - radius: big_icon_rect.size().x / 2.0, + radius: big_icon_rect.width() / 2.0, }); if self.checked { @@ -236,7 +236,7 @@ impl Widget for RadioButton { center: small_icon_rect.center(), fill_color: Some(stroke_color), outline: None, - radius: small_icon_rect.size().x / 2.0, + radius: small_icon_rect.width() / 2.0, }); } @@ -370,7 +370,7 @@ impl<'a> Widget for Slider<'a> { // Place the text in line with the slider on the left: columns[1] .desired_rect - .set_height(slider_response.rect.size().y); + .set_height(slider_response.rect.height()); columns[1].horizontal(Align::Center, |region| { region.add(Label::new(full_text)); }); @@ -380,9 +380,10 @@ impl<'a> Widget for Slider<'a> { } } else { let height = font.line_spacing().max(region.style().clickable_diameter); - let handle_radius = height / 3.0; + let handle_radius = height / 2.5; + + let id = region.make_position_id(); // TODO: causes problems for style settings :/ - let id = region.make_position_id(); let interact = region.reserve_space( Vec2 { x: region.available_width(), @@ -409,28 +410,28 @@ impl<'a> Widget for Slider<'a> { let value = self.get_value_f32(); let rect = interact.rect; - let rail_radius = (height / 10.0).round().max(2.0); + let rail_radius = (height / 8.0).round().max(2.0); let rail_rect = Rect::from_min_max( - pos2(left - rail_radius, rect.center().y - rail_radius), - pos2(right + rail_radius, rect.center().y + rail_radius), + pos2(interact.rect.left(), rect.center().y - rail_radius), + pos2(interact.rect.right(), rect.center().y + rail_radius), ); let marker_center_x = remap_clamp(value, min, max, left, right); region.add_paint_cmd(PaintCmd::Rect { + rect: rail_rect, corner_radius: rail_radius, fill_color: Some(region.style().background_fill_color()), outline: Some(Outline::new(1.0, color::gray(200, 255))), // TODO - rect: rail_rect, }); region.add_paint_cmd(PaintCmd::Circle { center: pos2(marker_center_x, rail_rect.center().y), + radius: handle_radius, fill_color: region.style().interact_fill_color(&interact), outline: Some(Outline::new( region.style().interact_stroke_width(&interact), region.style().interact_stroke_color(&interact), )), - radius: handle_radius, }); } diff --git a/emigui/src/window.rs b/emigui/src/window.rs index 1f130cba..34c2ca7c 100644 --- a/emigui/src/window.rs +++ b/emigui/src/window.rs @@ -120,7 +120,7 @@ impl Window { .unwrap_or(ctx.input.screen_size - 2.0 * window_padding); let default_pos = self.default_pos.unwrap_or(pos2(100.0, 100.0)); // TODO - let default_inner_size = self.default_size.unwrap_or(vec2(200.0, 200.0)); + let default_inner_size = self.default_size.unwrap_or(vec2(250.0, 250.0)); let id = ctx.make_unique_id(&self.title, default_pos); diff --git a/example_glium/src/main.rs b/example_glium/src/main.rs index 28416a4e..aec2aaf7 100644 --- a/example_glium/src/main.rs +++ b/example_glium/src/main.rs @@ -111,6 +111,8 @@ fn main() { quit = true; } + // TODO: Make it even simpler to show a window + Window::new("Examples") .default_pos(pos2(100.0, 100.0)) .default_size(vec2(300.0, 400.0)) @@ -119,28 +121,12 @@ fn main() { }); Window::new("Emigui settings") - .default_pos(pos2(100.0, 550.0)) + .default_pos(pos2(500.0, 100.0)) + .default_size(vec2(500.0, 500.0)) .show(region.ctx(), |region| { emigui.ui(region); }); - // TODO: Make it even simpler to show a window - Window::new("Test window") - .default_pos(pos2(600.0, 100.0)) - .show(region.ctx(), |region| { - region.add_label("Grab the window and move it around!"); - region.add_label("This window can be reisized, but not smaller than the contents."); - }); - Window::new("Resize me!") - .default_pos(pos2(600.0, 550.0)) - .expand_to_fit_content(false) - .show(region.ctx(), |region| { - region - .add_label("This window may shrink so small that its contents no longer fit."); - region.add_label("Maybe you can no longer read this, for instance"); - region.add_label("And this line may be way too far down."); - }); - painter.paint_batches(&display, emigui.paint(), emigui.texture()); let cursor = *emigui.ctx.cursor_icon.lock();