Allow the checkbox to be themed (#462)

Author: Earthgames

wgui/doc/widgets.md

@@ -356,6 +356,8 @@ _Translated by key_
 
 `box_size`: **float** (default: 24)
 
+`color_checked`: #FFAABB | #FFAABBCC
+
 `value`: **string**
 
 _optional value that will be sent with internal events_

wgui/src/components/button.rs

@@ -428,29 +428,19 @@ pub fn construct(ess: &mut ConstructEssentials, params: Params) -> anyhow::Resul
 	style.overflow.y = taffy::Overflow::Hidden;
 
 	// update colors to default ones if they are not specified
-	let color = if let Some(color) = params.color {
-		color
-	} else {
-		theme.button_color
-	};
+	let color = params.color.unwrap_or(theme.button_color);
 
-	let border_color = if let Some(border_color) = params.border_color {
-		border_color
-	} else {
-		Color::new(color.r, color.g, color.b, color.a + 0.25)
-	};
+	let border_color = params
+		.border_color
+		.unwrap_or_else(|| Color::new(color.r, color.g, color.b, color.a + 0.25));
 
-	let hover_color = if let Some(hover_color) = params.hover_color {
-		hover_color
-	} else {
-		Color::new(color.r + 0.25, color.g + 0.25, color.g + 0.25, color.a + 0.15)
-	};
+	let hover_color = params
+		.hover_color
+		.unwrap_or_else(|| Color::new(color.r + 0.25, color.g + 0.25, color.g + 0.25, color.a + 0.15));
 
-	let hover_border_color = if let Some(hover_border_color) = params.hover_border_color {
-		hover_border_color
-	} else {
-		Color::new(color.r + 0.5, color.g + 0.5, color.g + 0.5, color.a + 0.5)
-	};
+	let hover_border_color = params
+		.hover_border_color
+		.unwrap_or_else(|| Color::new(color.r + 0.5, color.g + 0.5, color.g + 0.5, color.a + 0.5));
 
 	let gradient_intensity = theme.gradient_intensity;
 

wgui/src/components/checkbox.rs

@@ -31,6 +31,7 @@ use crate::{
 pub struct Params {
 	pub text: Translation,
 	pub style: taffy::Style,
+	pub color_checked: Option<Color>,
 	pub box_size: f32,
 	pub checked: bool,
 	pub radio_group: Option<Rc<ComponentRadioGroup>>,
@@ -43,6 +44,7 @@ impl Default for Params {
 		Self {
 			text: Translation::from_raw_text(""),
 			style: Default::default(),
+			color_checked: None,
 			box_size: 24.0,
 			checked: false,
 			radio_group: None,
@@ -84,6 +86,8 @@ struct Data {
 	id_label: WidgetID,     // Label, parent of container
 	value: Option<Rc<str>>, // arbitrary value assigned to the element
 	radio_group: Option<Weak<ComponentRadioGroup>>,
+
+	color_checked: Color,
 }
 
 pub struct ComponentCheckbox {
@@ -92,6 +96,8 @@ pub struct ComponentCheckbox {
 	state: Rc<RefCell<State>>,
 }
 
+const COLOR_UNCHECKED: Color = Color::new(0.0, 0.0, 0.0, 0.0);
+
 impl ComponentTrait for ComponentCheckbox {
 	fn base(&self) -> &ComponentBase {
 		&self.base
@@ -106,12 +112,9 @@ impl ComponentTrait for ComponentCheckbox {
 	}
 }
 
-const COLOR_CHECKED: Color = Color::new(0.1, 0.5, 1.0, 1.0);
-const COLOR_UNCHECKED: Color = Color::new(0.1, 0.5, 1.0, 0.0);
-
 fn set_box_checked(widgets: &layout::WidgetMap, data: &Data, checked: bool) {
 	widgets.call(data.id_inner_box, |rect: &mut WidgetRectangle| {
-		rect.params.color = if checked { COLOR_CHECKED } else { COLOR_UNCHECKED }
+		rect.params.color = if checked { data.color_checked } else { COLOR_UNCHECKED }
 	});
 }
 
@@ -315,6 +318,7 @@ fn register_event_mouse_release(
 
 pub fn construct(ess: &mut ConstructEssentials, params: Params) -> anyhow::Result<(WidgetPair, Rc<ComponentCheckbox>)> {
 	let mut style = params.style;
+	let theme = &ess.layout.state.theme;
 
 	// force-override style
 	style.flex_wrap = taffy::FlexWrap::NoWrap;
@@ -343,6 +347,8 @@ pub fn construct(ess: &mut ConstructEssentials, params: Params) -> anyhow::Resul
 		(WLength::Units(5.0), WLength::Units(8.0))
 	};
 
+	let color_checked = params.color_checked.unwrap_or(theme.accent_color);
+
 	let (root, _) = ess.layout.add_child(
 		ess.parent,
 		WidgetRectangle::create(WidgetRectangleParams {
@@ -383,7 +389,7 @@ pub fn construct(ess: &mut ConstructEssentials, params: Params) -> anyhow::Resul
 		outer_box.id,
 		WidgetRectangle::create(WidgetRectangleParams {
 			round: round_5,
-			color: if params.checked { COLOR_CHECKED } else { COLOR_UNCHECKED },
+			color: if params.checked { color_checked } else { COLOR_UNCHECKED },
 			..Default::default()
 		}),
 		taffy::Style {
@@ -413,6 +419,7 @@ pub fn construct(ess: &mut ConstructEssentials, params: Params) -> anyhow::Resul
 		id_label: label.id,
 		value: params.value,
 		radio_group: params.radio_group.as_ref().map(Rc::downgrade),
+		color_checked,
 	});
 
 	let state = Rc::new(RefCell::new(State {

wgui/src/parser/component_checkbox.rs

@@ -91,6 +91,7 @@ pub fn parse_component_checkbox(
 			radio_group,
 			value: component_value,
 			tooltip: tooltip.get_info(),
+			color_checked: None,
 		},
 	)?;