diff --git a/CHANGELOG.md b/CHANGELOG.md index c5c102cc9..2251e5dee 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,7 @@ NOTE: [`eframe`](eframe/CHANGELOG.md), [`egui_web`](egui_web/CHANGELOG.md), [`eg * `TextEdit::layouter`: Add custom text layout for e.g. syntax highlighting or WYSIWYG. * `Fonts::layout_job*`: New text layout engine allowing mixing fonts, colors and styles, with underlining and strikethrough. * Add feature `"serialize"` separatedly from `"persistence"`. +* Add `egui::widgets::global_dark_light_mode_buttons` to easily add buttons for switching the egui theme. ### Changed 🔧 * Label text will now be centered, right-aligned and/or justified based on the layout. diff --git a/egui/src/style.rs b/egui/src/style.rs index d09d51304..c74c5f033 100644 --- a/egui/src/style.rs +++ b/egui/src/style.rs @@ -801,11 +801,9 @@ impl WidgetVisuals { impl Visuals { /// Show radio-buttons to switch between light and dark mode. pub fn light_dark_radio_buttons(&mut self, ui: &mut crate::Ui) { - ui.group(|ui| { - ui.horizontal(|ui| { - ui.radio_value(self, Self::light(), "☀ Light"); - ui.radio_value(self, Self::dark(), "🌙 Dark"); - }); + ui.horizontal(|ui| { + ui.selectable_value(self, Self::light(), "☀ Light"); + ui.selectable_value(self, Self::dark(), "🌙 Dark"); }); } diff --git a/egui/src/widgets/mod.rs b/egui/src/widgets/mod.rs index 532920db1..0b630cd06 100644 --- a/egui/src/widgets/mod.rs +++ b/egui/src/widgets/mod.rs @@ -121,3 +121,19 @@ pub(crate) fn shadow_ui(ui: &mut Ui, shadow: &mut epaint::Shadow, text: &str) { ui.color_edit_button_srgba(color); }); } + +/// Show a small button to switch to/from dark/light mode (globally). +pub fn global_dark_light_mode_switch(ui: &mut Ui) { + let style: crate::Style = (*ui.ctx().style()).clone(); + let new_visuals = style.visuals.light_dark_small_toggle_button(ui); + if let Some(visuals) = new_visuals { + ui.ctx().set_visuals(visuals); + } +} + +/// Show larger buttons for switching between light and dark mode (globally). +pub fn global_dark_light_mode_buttons(ui: &mut Ui) { + let mut visuals = ui.ctx().style().visuals.clone(); + visuals.light_dark_radio_buttons(ui); + ui.ctx().set_visuals(visuals); +} diff --git a/egui_demo_lib/src/wrap_app.rs b/egui_demo_lib/src/wrap_app.rs index 5559fd849..ccf369df2 100644 --- a/egui_demo_lib/src/wrap_app.rs +++ b/egui_demo_lib/src/wrap_app.rs @@ -113,7 +113,7 @@ impl WrapApp { // A menu-bar is a horizontal layout with some special styles applied. // egui::menu::bar(ui, |ui| { ui.horizontal_wrapped(|ui| { - dark_light_mode_switch(ui); + egui::widgets::global_dark_light_mode_switch(ui); ui.checkbox(&mut self.backend_panel.open, "💻 Backend"); ui.separator(); @@ -222,12 +222,3 @@ fn clock_button(ui: &mut egui::Ui, seconds_since_midnight: f64) -> egui::Respons ui.add(egui::Button::new(time).text_style(egui::TextStyle::Monospace)) } - -/// Show a button to switch to/from dark/light mode (globally). -fn dark_light_mode_switch(ui: &mut egui::Ui) { - let style: egui::Style = (*ui.ctx().style()).clone(); - let new_visuals = style.visuals.light_dark_small_toggle_button(ui); - if let Some(visuals) = new_visuals { - ui.ctx().set_visuals(visuals); - } -}