Skip to content

Commit 93c06c3

Browse files
lucasmerlinlucasmerlin
authored
Add color picker menu item example (#5755)
* To be merged after #5756 https://github.com/user-attachments/assets/ad40c172-cad2-4cc5-a3ef-3284b6545e94
1 parent a2afc8d commit 93c06c3

File tree

2 files changed

+82
-52
lines changed

2 files changed

+82
-52
lines changed

‎crates/ecolor/src/color32.rs‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -295,6 +295,14 @@ impl Color32 {
295295
pub fn blend(self, on_top: Self) -> Self {
296296
self.gamma_multiply_u8(255 - on_top.a()) + on_top
297297
}
298+
299+
/// Intensity of the color.
300+
///
301+
/// Returns a value in the range 0-1.
302+
/// The brighter the color, the closer to 1.
303+
pub fn intensity(&self) -> f32 {
304+
(self.r() as f32 * 0.299 + self.g() as f32 * 0.587 + self.b() as f32 * 0.114) / 255.0
305+
}
298306
}
299307

300308
impl std::ops::Mul for Color32 {

‎crates/egui_demo_lib/src/demo/popups.rs‎

Lines changed: 74 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
use crate::rust_view_ui;
2+
use egui::color_picker::{color_picker_color32, Alpha};
23
use egui::containers::menu::{MenuConfig, SubMenuButton};
34
use egui::{
45
include_image, Align, Align2, ComboBox, Frame, Id, Layout, Popup, PopupCloseBehavior,
5-
RectAlign, Tooltip, Ui, UiBuilder,
6+
RectAlign, RichText, Tooltip, Ui, UiBuilder,
67
};
78

89
/// Showcase [`Popup`].
@@ -16,6 +17,7 @@ pub struct PopupsDemo {
1617
close_behavior: PopupCloseBehavior,
1718
popup_open: bool,
1819
checked: bool,
20+
color: egui::Color32,
1921
}
2022

2123
impl PopupsDemo {
@@ -25,6 +27,74 @@ impl PopupsDemo {
2527
.gap(self.gap)
2628
.close_behavior(self.close_behavior)
2729
}
30+
31+
fn nested_menus(&mut self, ui: &mut Ui) {
32+
ui.set_max_width(200.0); // To make sure we wrap long text
33+
34+
if ui.button("Open…").clicked() {
35+
ui.close();
36+
}
37+
ui.menu_button("Popups can have submenus", |ui| {
38+
ui.menu_button("SubMenu", |ui| {
39+
if ui.button("Open…").clicked() {
40+
ui.close();
41+
}
42+
let _ = ui.button("Item");
43+
ui.menu_button("Recursive", |ui| self.nested_menus(ui));
44+
});
45+
ui.menu_button("SubMenu", |ui| {
46+
if ui.button("Open…").clicked() {
47+
ui.close();
48+
}
49+
let _ = ui.button("Item");
50+
});
51+
let _ = ui.button("Item");
52+
if ui.button("Open…").clicked() {
53+
ui.close();
54+
}
55+
});
56+
ui.menu_image_text_button(
57+
include_image!("../../data/icon.png"),
58+
"I have an icon!",
59+
|ui| {
60+
let _ = ui.button("Item1");
61+
let _ = ui.button("Item2");
62+
let _ = ui.button("Item3");
63+
let _ = ui.button("Item4");
64+
if ui.button("Open…").clicked() {
65+
ui.close();
66+
}
67+
},
68+
);
69+
let _ = ui.button("Very long text for this item that should be wrapped");
70+
SubMenuButton::new("Always CloseOnClickOutside")
71+
.config(MenuConfig::new().close_behavior(PopupCloseBehavior::CloseOnClickOutside))
72+
.ui(ui, |ui| {
73+
ui.checkbox(&mut self.checked, "Checkbox");
74+
75+
// Customized color SubMenuButton
76+
let is_bright = self.color.intensity() > 0.5;
77+
let text_color = if is_bright {
78+
egui::Color32::BLACK
79+
} else {
80+
egui::Color32::WHITE
81+
};
82+
let mut color_button =
83+
SubMenuButton::new(RichText::new("Background").color(text_color));
84+
color_button.button = color_button.button.fill(self.color);
85+
color_button.button = color_button
86+
.button
87+
.right_text(RichText::new(SubMenuButton::RIGHT_ARROW).color(text_color));
88+
color_button.ui(ui, |ui| {
89+
ui.spacing_mut().slider_width = 200.0;
90+
color_picker_color32(ui, &mut self.color, Alpha::Opaque);
91+
});
92+
93+
if ui.button("Open…").clicked() {
94+
ui.close();
95+
}
96+
});
97+
}
2898
}
2999

30100
impl Default for PopupsDemo {
@@ -35,6 +105,7 @@ impl Default for PopupsDemo {
35105
close_behavior: PopupCloseBehavior::CloseOnClick,
36106
popup_open: false,
37107
checked: false,
108+
color: egui::Color32::RED,
38109
}
39110
}
40111
}
@@ -57,55 +128,6 @@ impl crate::Demo for PopupsDemo {
57128
}
58129
}
59130

60-
fn nested_menus(ui: &mut egui::Ui, checked: &mut bool) {
61-
ui.set_max_width(200.0); // To make sure we wrap long text
62-
63-
if ui.button("Open…").clicked() {
64-
ui.close();
65-
}
66-
ui.menu_button("Popups can have submenus", |ui| {
67-
ui.menu_button("SubMenu", |ui| {
68-
if ui.button("Open…").clicked() {
69-
ui.close();
70-
}
71-
let _ = ui.button("Item");
72-
ui.menu_button("Recursive", |ui| nested_menus(ui, checked));
73-
});
74-
ui.menu_button("SubMenu", |ui| {
75-
if ui.button("Open…").clicked() {
76-
ui.close();
77-
}
78-
let _ = ui.button("Item");
79-
});
80-
let _ = ui.button("Item");
81-
if ui.button("Open…").clicked() {
82-
ui.close();
83-
}
84-
});
85-
ui.menu_image_text_button(
86-
include_image!("../../data/icon.png"),
87-
"I have an icon!",
88-
|ui| {
89-
let _ = ui.button("Item1");
90-
let _ = ui.button("Item2");
91-
let _ = ui.button("Item3");
92-
let _ = ui.button("Item4");
93-
if ui.button("Open…").clicked() {
94-
ui.close();
95-
}
96-
},
97-
);
98-
let _ = ui.button("Very long text for this item that should be wrapped");
99-
SubMenuButton::new("Always CloseOnClickOutside")
100-
.config(MenuConfig::new().close_behavior(PopupCloseBehavior::CloseOnClickOutside))
101-
.ui(ui, |ui| {
102-
ui.checkbox(checked, "Checkbox");
103-
if ui.button("Open…").clicked() {
104-
ui.close();
105-
}
106-
});
107-
}
108-
109131
impl crate::View for PopupsDemo {
110132
fn ui(&mut self, ui: &mut egui::Ui) {
111133
let response = Frame::group(ui.style())
@@ -117,10 +139,10 @@ impl crate::View for PopupsDemo {
117139
.inner;
118140

119141
self.apply_options(Popup::menu(&response).id(Id::new("menu")))
120-
.show(|ui| nested_menus(ui, &mut self.checked));
142+
.show(|ui| self.nested_menus(ui));
121143

122144
self.apply_options(Popup::context_menu(&response).id(Id::new("context_menu")))
123-
.show(|ui| nested_menus(ui, &mut self.checked));
145+
.show(|ui| self.nested_menus(ui));
124146

125147
if self.popup_open {
126148
self.apply_options(Popup::from_response(&response).id(Id::new("popup")))

0 commit comments

Comments
 (0)