slightly better approach to get the cut-scene looking better

This commit is contained in:
Michael Kirk 2021-02-26 15:38:39 -08:00 committed by Dustin Carlino
parent d99c0e0634
commit cf69dd0370
3 changed files with 82 additions and 24 deletions

View File

@ -1,7 +1,7 @@
use map_gui::tools::grey_out_map;
use widgetry::{
hotkeys, Color, ControlState, DrawBaselayer, EventCtx, GeomBatch, GfxCtx, Image, Key, Line,
Outcome, Panel, State, StyledButtons, Text, Widget,
hotkeys, ButtonStyle, Color, ControlState, DrawBaselayer, EventCtx, GeomBatch, GfxCtx, Image,
Key, Line, Outcome, Panel, State, StyledButtons, Text, Widget,
};
use crate::app::App;
@ -32,7 +32,7 @@ impl CutsceneBuilder {
}
fn fg_color() -> Color {
Color::hex("#4C4C4C")
ButtonStyle::outline_dark_fg().fg
}
pub fn player<I: Into<String>>(mut self, msg: I) -> CutsceneBuilder {
@ -145,11 +145,8 @@ fn make_panel(
make_task: &Box<dyn Fn(&mut EventCtx) -> Widget>,
idx: usize,
) -> Panel {
let prev_builder = ctx
.style()
.btn_plain_icon("system/assets/tools/circled_prev.svg")
.image_color(CutsceneBuilder::fg_color(), ControlState::Default)
.bg_color(Color::grey(0.1), ControlState::Hovered)
let prev_builder = ButtonStyle::outline_dark_fg()
.plain_icon("system/assets/tools/circled_prev.svg")
.image_dims(45.0)
.hotkey(Key::LeftArrow)
.bg_color(Color::CLEAR, ControlState::Disabled);
@ -226,10 +223,8 @@ fn make_panel(
.margin_above(100),
Widget::col(vec![
Widget::row(vec![prev.margin_right(40), next]).centered_horiz(),
ctx.style()
.btn_outline_text("Skip cutscene")
.outline(2.0, CutsceneBuilder::fg_color(), ControlState::Default)
.label_color(CutsceneBuilder::fg_color(), ControlState::Default)
ButtonStyle::outline_dark_fg()
.outline_text("Skip cutscene")
.build_def(ctx)
.centered_horiz(),
])

View File

@ -224,6 +224,55 @@ impl<'a> StyledButtons<'a> for Style {
}
}
impl<'a> ButtonStyle {
pub fn plain(&self) -> ButtonBuilder<'a> {
basic_button(self, None)
}
pub fn outline(&self) -> ButtonBuilder<'a> {
self.plain()
.outline(self.outline_thickness, self.outline, ControlState::Default)
}
pub fn plain_text(&self, text: &'a str) -> ButtonBuilder<'a> {
self.plain().label_text(text)
}
pub fn plain_icon(&self, image_path: &'a str) -> ButtonBuilder<'a> {
icon_button(self.plain().image_path(image_path))
}
pub fn plain_icon_bytes(&self, labeled_bytes: (&'a str, &'a [u8])) -> ButtonBuilder<'a> {
icon_button(self.plain().image_bytes(labeled_bytes))
}
pub fn plain_icon_text(&self, image_path: &'a str, text: &'a str) -> ButtonBuilder<'a> {
self.plain()
.label_text(text)
.image_path(image_path)
.image_dims(ScreenDims::square(18.0))
}
pub fn outline_text(&self, text: &'a str) -> ButtonBuilder<'a> {
self.outline().label_text(text)
}
pub fn outline_icon(&self, image_path: &'a str) -> ButtonBuilder<'a> {
icon_button(self.outline().image_path(image_path))
}
pub fn outline_icon_bytes(&self, labeled_bytes: (&'a str, &'a [u8])) -> ButtonBuilder<'a> {
icon_button(self.outline().image_bytes(labeled_bytes))
}
pub fn outline_icon_text(&self, image_path: &'a str, text: &'a str) -> ButtonBuilder<'a> {
self.outline()
.label_text(text)
.image_path(image_path)
.image_dims(ScreenDims::square(18.0))
}
}
impl<'a> Style {
pub fn btn_popup_icon_text(&self, icon_path: &'a str, text: &'a str) -> ButtonBuilder<'a> {
let outline_style = &self.btn_outline;

View File

@ -32,10 +32,11 @@ pub struct ButtonStyle {
pub bg: Color,
pub bg_hover: Color,
pub bg_disabled: Color,
pub outline_thickness: f64,
}
impl ButtonStyle {
pub fn btn_solid() -> Self {
pub fn solid_dark_fg() -> Self {
ButtonStyle {
fg: hex("#4C4C4C"),
fg_disabled: hex("#4C4C4C").alpha(0.3),
@ -43,10 +44,11 @@ impl ButtonStyle {
bg_hover: Color::WHITE,
bg_disabled: Color::grey(0.6),
outline: Color::WHITE.alpha(0.6),
outline_thickness: 2.0,
}
}
pub fn btn_outline_dark() -> Self {
pub fn outline_dark_fg() -> Self {
ButtonStyle {
fg: hex("#4C4C4C"),
fg_disabled: hex("#4C4C4C").alpha(0.3),
@ -54,10 +56,11 @@ impl ButtonStyle {
bg_hover: hex("#4C4C4C").alpha(0.1),
bg_disabled: Color::grey(0.8),
outline: hex("#4C4C4C"),
outline_thickness: 2.0,
}
}
pub fn btn_solid_floating() -> Self {
pub fn solid_light_fg() -> Self {
ButtonStyle {
fg: hex("#F2F2F2"),
fg_disabled: hex("#F2F2F2").alpha(0.3),
@ -65,10 +68,11 @@ impl ButtonStyle {
bg_hover: hex("#003046"),
bg_disabled: Color::grey(0.1),
outline: hex("#003046").alpha(0.6),
outline_thickness: 2.0,
}
}
pub fn btn_outline() -> Self {
pub fn outline_light_fg() -> Self {
ButtonStyle {
fg: hex("#F2F2F2"),
fg_disabled: hex("#F2F2F2").alpha(0.3),
@ -76,6 +80,7 @@ impl ButtonStyle {
bg_hover: hex("#F2F2F2").alpha(0.1),
bg_disabled: Color::grey(0.5),
outline: hex("#F2F2F2"),
outline_thickness: 2.0,
}
}
}
@ -94,7 +99,7 @@ impl Style {
text_hotkey_color: hex("#EE702E"),
text_tooltip_color: Color::WHITE,
text_destructive_color: hex("#FF5E5E"),
btn_outline: ButtonStyle::btn_outline_dark(),
btn_outline: ButtonStyle::outline_dark_fg(),
btn_solid: ButtonStyle {
fg: Color::WHITE,
fg_disabled: Color::WHITE.alpha(0.3),
@ -102,8 +107,9 @@ impl Style {
bg_hover: hex("#4C4C4C"),
bg_disabled: Color::grey(0.6),
outline: hex("#4C4C4C").alpha(0.6),
outline_thickness: 2.0,
},
btn_solid_floating: ButtonStyle::btn_solid(),
btn_solid_floating: ButtonStyle::solid_dark_fg(),
btn_solid_destructive: ButtonStyle {
fg: hex("#F2F2F2"),
fg_disabled: hex("#F2F2F2").alpha(0.3),
@ -111,6 +117,7 @@ impl Style {
bg_hover: hex("#FF5E5E"),
bg_disabled: Color::grey(0.1),
outline: hex("#FF5E5E").alpha(0.6),
outline_thickness: 2.0,
},
btn_outline_destructive: ButtonStyle {
fg: hex("#FF5E5E"),
@ -119,6 +126,7 @@ impl Style {
bg_hover: hex("#FF5E5E").alpha(0.1),
bg_disabled: Color::grey(0.1),
outline: hex("#FF5E5E"),
outline_thickness: 2.0,
},
btn_solid_primary: ButtonStyle {
fg: hex("#F2F2F2"),
@ -127,6 +135,7 @@ impl Style {
bg_hover: hex("#EE702E"),
bg_disabled: hex("#EE702E").alpha(0.3),
outline: hex("#EE702E").alpha(0.6),
outline_thickness: 2.0,
},
btn_outline_primary: ButtonStyle {
fg: hex("#EE702E"),
@ -135,6 +144,7 @@ impl Style {
bg_hover: hex("#EE702E").alpha(0.1),
bg_disabled: Color::grey(0.1),
outline: hex("#EE702E"),
outline_thickness: 2.0,
},
}
}
@ -152,9 +162,9 @@ impl Style {
text_hotkey_color: Color::GREEN,
text_tooltip_color: Color::WHITE,
text_destructive_color: hex("#EB3223"),
btn_outline: ButtonStyle::btn_outline(),
btn_solid: ButtonStyle::btn_solid(),
btn_solid_floating: ButtonStyle::btn_solid_floating(),
btn_outline: ButtonStyle::outline_light_fg(),
btn_solid: ButtonStyle::solid_dark_fg(),
btn_solid_floating: ButtonStyle::solid_light_fg(),
btn_solid_destructive: ButtonStyle {
fg: hex("#F2F2F2"),
fg_disabled: hex("#F2F2F2").alpha(0.3),
@ -162,6 +172,7 @@ impl Style {
bg_hover: hex("#FF5E5E"),
bg_disabled: Color::grey(0.1),
outline: hex("#FF5E5E").alpha(0.6),
outline_thickness: 2.0,
},
btn_outline_destructive: ButtonStyle {
fg: hex("#FF5E5E"),
@ -170,6 +181,7 @@ impl Style {
bg_hover: hex("#FF5E5E").alpha(0.1),
bg_disabled: Color::grey(0.1),
outline: hex("#FF5E5E"),
outline_thickness: 2.0,
},
btn_solid_primary: ButtonStyle {
fg: hex("#F2F2F2"),
@ -178,6 +190,7 @@ impl Style {
bg_hover: hex("#EE702E"),
bg_disabled: hex("#EE702E").alpha(0.3),
outline: hex("#EE702E").alpha(0.6),
outline_thickness: 2.0,
},
btn_outline_primary: ButtonStyle {
fg: hex("#EE702E"),
@ -186,6 +199,7 @@ impl Style {
bg_hover: hex("#EE702E").alpha(0.1),
bg_disabled: Color::grey(0.1),
outline: hex("#EE702E"),
outline_thickness: 2.0,
},
}
}
@ -194,9 +208,9 @@ impl Style {
let mut style = Self::light_bg();
style.panel_bg = hex("#003046").alpha(0.9);
style.field_bg = style.panel_bg.shade(0.2);
style.btn_outline = ButtonStyle::btn_outline();
style.btn_solid = ButtonStyle::btn_solid();
style.btn_solid_floating = ButtonStyle::btn_solid_floating();
style.btn_outline = ButtonStyle::outline_light_fg();
style.btn_solid = ButtonStyle::solid_dark_fg();
style.btn_solid_floating = ButtonStyle::solid_light_fg();
style.text_fg_color = Color::WHITE;
style.icon_fg = Color::WHITE;
style.text_hotkey_color = Color::GREEN;