a-b-street/abstreet
1
1
Fork 0
mirror of https://github.com/a-b-street/abstreet.git synced 2024-12-25 15:33:44 +03:00
Code Issues Projects Releases Wiki Activity

use colored checkboxes in plot too. generate the shape programatically.

Browse Source
This commit is contained in:
Dustin Carlino 2020-04-06 14:45:22 -07:00
parent ebf31c33e6
commit 7ff9a90516
7 changed files with 68 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
data/MANIFEST.txt
View File

@ -161,7 +161,6 @@ d15fe87c4174463e84b9a440162129ed data/system/assets/tools/undo.svg
5f3912d972b47419295ded39c52e647d data/system/assets/tools/next.svg
e469148085a2046afd447d31a54d15ab data/system/assets/tools/search.svg
8aeb89a0a9ef4e84d0202fb45f65d642 data/system/assets/tools/location.svg
e26e99e490443b1c2f6296586cda4551 data/system/assets/tools/checkmark.svg
4a5d6456d7c3d9ad94fc1a9e456d6f06 data/system/assets/tools/prev.svg
fe358c0fdf48b65117f7c4970fa35d91 data/system/assets/tools/settings.svg
1e0135f13d0aea11650460d6a61b5463 data/system/assets/tools/edit.svg

4
data/system/assets/tools/checkmark.svg
View File

@ -1,4 +0,0 @@
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="32" height="32" rx="16" fill="black"/>
<path d="M11.4528 22.1072L5.89284 16.5472L3.99951 18.4272L11.4528 25.8805L27.4528 9.88049L25.5728 8.00049L11.4528 22.1072Z" fill="white"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 294 B

2
ezgui/src/style.rs
View File

@ -6,6 +6,7 @@ pub struct Style {
pub outline_color: Color,
pub panel_bg: Color,
pub hotkey_color: Color,
pub hovering_color: Color,
}
impl Style {
@ -15,6 +16,7 @@ impl Style {
outline_color: Color::WHITE,
panel_bg: Color::grey(0.4),
hotkey_color: Color::GREEN,
hovering_color: Color::ORANGE,
}
}
}

47
ezgui/src/widgets/checkbox.rs
View File

@ -1,6 +1,8 @@
use crate::{
Btn, Button, EventCtx, GfxCtx, MultiKey, ScreenDims, ScreenPt, Widget, WidgetImpl, WidgetOutput,
Btn, Button, Color, EventCtx, GeomBatch, GfxCtx, MultiKey, ScreenDims, ScreenPt, Widget,
WidgetImpl, WidgetOutput,
};
use geom::{Polygon, Pt2D};
pub struct Checkbox {
pub(crate) enabled: bool,
@ -41,6 +43,49 @@ impl Checkbox {
.named(label)
}
pub fn colored(ctx: &EventCtx, label: &str, color: Color, enabled: bool) -> Widget {
let vert_pad = 4.0;
let horiz_pad = 4.0;
let checkmark = Polygon::new(&vec![
Pt2D::new(11.4528, 22.1072),
Pt2D::new(5.89284, 16.5472),
Pt2D::new(3.99951, 18.4272),
Pt2D::new(11.4528, 25.8805),
Pt2D::new(27.4528, 9.88049),
Pt2D::new(25.5728, 8.00049),
Pt2D::new(11.4528, 22.1072),
])
.translate(0.0, -4.0);
let bounds = checkmark.get_bounds();
let hitbox = Polygon::rectangle(
bounds.width() + 2.0 * horiz_pad,
bounds.height() + 2.0 * vert_pad,
);
let true_btn = Btn::custom(
GeomBatch::from(vec![
(color, hitbox.clone()),
(Color::WHITE, checkmark.clone()),
]),
GeomBatch::from(vec![
(color, hitbox.clone()),
(ctx.style().hovering_color, checkmark),
]),
hitbox.clone(),
)
.build(ctx, format!("hide {}", label), None);
let false_btn = Btn::custom(
GeomBatch::from(vec![(color.alpha(0.3), hitbox.clone())]),
GeomBatch::from(vec![(color, hitbox.clone())]),
hitbox,
)
.build(ctx, format!("show {}", label), None);
Checkbox::new(enabled, false_btn, true_btn).named(label)
}
pub(crate) fn callback_to_plot(mut self, plot_id: &str, checkbox_label: &str) -> Checkbox {
self.cb_to_plot = Some((plot_id.to_string(), checkbox_label.to_string()));
self

20
ezgui/src/widgets/plot.rs
View File

@ -54,24 +54,22 @@ impl<T: Yvalue<T>> Plot<T> {
series[0].label.clone().draw_text(ctx),
])
} else {
Widget::row(
series
.iter()
.map(|s| {
// TODO Colored checkbox
let mut row = Vec::new();
for s in &series {
row.push(Widget::row(vec![
Widget::new(Box::new(
Checkbox::text(ctx, &s.label, None, true)
Checkbox::colored(ctx, &s.label, s.color, true)
.take_checkbox()
.callback_to_plot(id, &s.label),
))
// TODO Messy! We have to remember to repeat what Checkbox::text does,
// because we used take_checkbox
.named(&s.label)
.outline(ctx.style().outline_thickness, ctx.style().outline_color)
})
.collect(),
)
.flex_wrap(ctx, 24)
.margin_right(8),
Line(&s.label).draw(ctx),
]));
}
Widget::row(row).flex_wrap(ctx, 24)
};
// Assume min_x is Time::START_OF_DAY and min_y is T::zero()

2
game/src/colors.rs
View File

@ -131,7 +131,7 @@ impl ColorScheme {
let gui_style = Style::standard();
ColorScheme {
// UI
hovering: Color::ORANGE,
hovering: gui_style.hovering_color,
panel_bg: gui_style.panel_bg,
section_bg: Color::grey(0.5),
inner_panel: hex("#4C4C4C"),

32
game/src/common/minimap.rs
View File

@ -5,8 +5,7 @@ use crate::render::MIN_ZOOM_FOR_DETAIL;
use abstutil::clamp;
use ezgui::{
hotkey, Btn, Checkbox, Color, Composite, EventCtx, Filler, GeomBatch, GfxCtx,
HorizontalAlignment, Key, Line, Outcome, RewriteColor, ScreenDims, ScreenPt, VerticalAlignment,
Widget,
HorizontalAlignment, Key, Line, Outcome, ScreenDims, ScreenPt, VerticalAlignment, Widget,
};
use geom::{Distance, Polygon, Pt2D, Ring};
@ -364,7 +363,7 @@ fn make_tool_panel(ctx: &mut EventCtx, app: &App) -> Widget {
fn make_horiz_viz_panel(ctx: &mut EventCtx, app: &App) -> Widget {
let mut row = Vec::new();
for (label, color, enabled) in &app.agent_cs.rows {
row.push(colored_checkbox(ctx, app, label, *color, *enabled).margin_right(8));
row.push(Checkbox::colored(ctx, label, *color, *enabled).margin_right(8));
row.push(Line(label).draw(ctx).margin_right(24));
}
let last = row.pop().unwrap();
@ -377,7 +376,7 @@ fn make_vert_viz_panel(ctx: &mut EventCtx, app: &App) -> Widget {
for (label, color, enabled) in &app.agent_cs.rows {
let mut row = Vec::new();
row.push(colored_checkbox(ctx, app, label, *color, *enabled).margin_right(8));
row.push(Checkbox::colored(ctx, label, *color, *enabled).margin_right(8));
row.push(Line(label).draw(ctx));
col.push(Widget::row(row).margin_below(7));
}
@ -386,28 +385,3 @@ fn make_vert_viz_panel(ctx: &mut EventCtx, app: &App) -> Widget {
Widget::col(col)
}
fn colored_checkbox(ctx: &EventCtx, app: &App, label: &str, color: Color, enabled: bool) -> Widget {
let true_btn = Btn::svg(
"../data/system/assets/tools/checkmark.svg",
RewriteColor::ChangeMore(vec![(Color::BLACK, color), (Color::WHITE, app.cs.hovering)]),
)
.normal_color(RewriteColor::Change(Color::BLACK, color))
.build(ctx, format!("hide {}", label), None);
// Fancy way of saying a circle ;)
let false_btn = Btn::svg(
"../data/system/assets/tools/checkmark.svg",
RewriteColor::ChangeMore(vec![
(Color::BLACK, color),
(Color::WHITE, Color::INVISIBLE),
]),
)
.normal_color(RewriteColor::ChangeMore(vec![
(Color::BLACK, color.alpha(0.3)),
(Color::WHITE, Color::INVISIBLE),
]))
.build(ctx, format!("show {}", label), None);
Checkbox::new(enabled, false_btn, true_btn).named(label)
}