egui_demo_lib/demo/
tooltips.rs

1#[derive(Clone, PartialEq, Eq)]
2#[cfg_attr(feature = "serde", derive(serde::Deserialize, serde::Serialize))]
3pub struct Tooltips {
4    enabled: bool,
5}
6
7impl Default for Tooltips {
8    fn default() -> Self {
9        Self { enabled: true }
10    }
11}
12
13impl crate::Demo for Tooltips {
14    fn name(&self) -> &'static str {
15        "🗖 Tooltips"
16    }
17
18    fn show(&mut self, ctx: &egui::Context, open: &mut bool) {
19        use crate::View as _;
20        let window = egui::Window::new("Tooltips")
21            .constrain(false) // So we can test how tooltips behave close to the screen edge
22            .resizable(true)
23            .default_size([450.0, 300.0])
24            .scroll(false)
25            .open(open);
26        window.show(ctx, |ui| self.ui(ui));
27    }
28}
29
30impl crate::View for Tooltips {
31    fn ui(&mut self, ui: &mut egui::Ui) {
32        ui.spacing_mut().item_spacing.y = 8.0;
33
34        ui.vertical_centered(|ui| {
35            ui.add(crate::egui_github_link_file_line!());
36        });
37
38        egui::SidePanel::right("scroll_test").show_inside(ui, |ui| {
39            ui.label(
40                "The scroll area below has many labels with interactive tooltips. \
41                 The purpose is to test that the tooltips close when you scroll.",
42            )
43            .on_hover_text("Try hovering a label below, then scroll!");
44            egui::ScrollArea::vertical()
45                .auto_shrink(false)
46                .show(ui, |ui| {
47                    for i in 0..1000 {
48                        ui.label(format!("This is line {i}")).on_hover_ui(|ui| {
49                            ui.style_mut().interaction.selectable_labels = true;
50                            ui.label(
51                            "This tooltip is interactive, because the text in it is selectable.",
52                        );
53                        });
54                    }
55                });
56        });
57
58        egui::CentralPanel::default().show_inside(ui, |ui| {
59            self.misc_tests(ui);
60        });
61    }
62}
63
64impl Tooltips {
65    fn misc_tests(&mut self, ui: &mut egui::Ui) {
66        ui.label("All labels in this demo have tooltips.")
67            .on_hover_text("Yes, even this one.");
68
69        ui.label("Some widgets have multiple tooltips!")
70            .on_hover_text("The first tooltip.")
71            .on_hover_text("The second tooltip.");
72
73        ui.label("Tooltips can contain interactive widgets.")
74            .on_hover_ui(|ui| {
75                ui.label("This tooltip contains a link:");
76                ui.hyperlink_to("www.egui.rs", "https://www.egui.rs/")
77                    .on_hover_text("The tooltip has a tooltip in it!");
78            });
79
80        ui.label("You can put selectable text in tooltips too.")
81            .on_hover_ui(|ui| {
82                ui.style_mut().interaction.selectable_labels = true;
83                ui.label("You can select this text.");
84            });
85
86        ui.label("This tooltip shows at the mouse cursor.")
87            .on_hover_text_at_pointer("Move me around!!");
88
89        ui.separator(); // ---------------------------------------------------------
90
91        let tooltip_ui = |ui: &mut egui::Ui| {
92            ui.horizontal(|ui| {
93                ui.label("This tooltip was created with");
94                ui.code(".on_hover_ui(…)");
95            });
96        };
97        let disabled_tooltip_ui = |ui: &mut egui::Ui| {
98            ui.label("A different tooltip when widget is disabled.");
99            ui.horizontal(|ui| {
100                ui.label("This tooltip was created with");
101                ui.code(".on_disabled_hover_ui(…)");
102            });
103        };
104
105        ui.label("You can have different tooltips depending on whether or not a widget is enabled:")
106            .on_hover_text("Check the tooltip of the button below, and see how it changes depending on whether or not it is enabled.");
107
108        ui.horizontal(|ui| {
109            ui.checkbox(&mut self.enabled, "Enabled")
110                .on_hover_text("Controls whether or not the following button is enabled.");
111
112            ui.add_enabled(self.enabled, egui::Button::new("Sometimes clickable"))
113                .on_hover_ui(tooltip_ui)
114                .on_disabled_hover_ui(disabled_tooltip_ui);
115        });
116    }
117}