djkato/egui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve custom_window_frame

Browse source
This commit is contained in:
Emil Ernerfeldt 2023-02-05 21:57:40 +01:00
parent 853d492724
commit d5dcc87ace
1 changed files with 111 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

209
examples/custom_window_frame/src/main.rs
View file

@ -31,7 +31,7 @@ impl eframe::App for MyApp {
fn update(&mut self, ctx: &egui::Context, frame: &mut eframe::Frame) { fn update(&mut self, ctx: &egui::Context, frame: &mut eframe::Frame) {
custom_window_frame(ctx, frame, "egui with custom frame", |ui| { custom_window_frame(ctx, frame, "egui with custom frame", |ui| {
ui.label("This is just the contents of the window"); ui.label("This is just the contents of the window.");
ui.horizontal(|ui| { ui.horizontal(|ui| {
ui.label("egui theme:"); ui.label("egui theme:");
egui::widgets::global_dark_light_mode_buttons(ui); egui::widgets::global_dark_light_mode_buttons(ui);
@ -47,105 +47,118 @@ fn custom_window_frame(
add_contents: impl FnOnce(&mut egui::Ui), add_contents: impl FnOnce(&mut egui::Ui),
) { ) {
use egui::*; use egui::*;
let text_color = ctx.style().visuals.text_color();
// Height of the title bar let panel_frame = egui::Frame {
let height = 28.0; fill: ctx.style().visuals.window_fill(),
rounding: 10.0.into(),
stroke: ctx.style().visuals.widgets.noninteractive.fg_stroke,
outer_margin: 0.5.into(), // so the stroke is within the bounds
..Default::default()
};
let button_height = 16.0; CentralPanel::default().frame(panel_frame).show(ctx, |ui| {
let app_rect = ui.max_rect();
CentralPanel::default() let title_bar_height = 32.0;
.frame(Frame::none()) let title_bar_rect = {
.show(ctx, |ui| { let mut rect = app_rect;
let rect = ui.max_rect(); rect.max.y = rect.min.y + title_bar_height;
let painter = ui.painter(); rect
};
title_bar_ui(ui, frame, title_bar_rect, title);
// Paint the frame: // Add the contents:
painter.rect( let content_rect = {
rect.shrink(1.0), let mut rect = app_rect;
10.0, rect.min.y = title_bar_rect.max.y;
ctx.style().visuals.window_fill(), rect
Stroke::new(1.0, text_color), }
); .shrink(4.0);
let mut content_ui = ui.child_ui(content_rect, *ui.layout());
// Paint the title: add_contents(&mut content_ui);
painter.text( });
rect.center_top() + vec2(0.0, height / 2.0), }
Align2::CENTER_CENTER,
title, fn title_bar_ui(
FontId::proportional(height * 0.8), ui: &mut egui::Ui,
text_color, frame: &mut eframe::Frame,
); title_bar_rect: eframe::epaint::Rect,
title: &str,
// Paint the line under the title: ) {
painter.line_segment( use egui::*;
[
rect.left_top() + vec2(2.0, height), let painter = ui.painter();
rect.right_top() + vec2(-2.0, height),
], let title_bar_response = ui.interact(title_bar_rect, Id::new("title_bar"), Sense::click());
Stroke::new(1.0, text_color),
); // Paint the title:
painter.text(
// Interact with the title bar (drag to move window): title_bar_rect.center(),
let title_bar_rect = { Align2::CENTER_CENTER,
let mut rect = rect; title,
rect.max.y = rect.min.y + height; FontId::proportional(20.0),
rect ui.style().visuals.text_color(),
}; );
let title_bar_response =
ui.interact(title_bar_rect, Id::new("title_bar"), Sense::click()); // Paint the line under the title:
painter.line_segment(
if title_bar_response.double_clicked() { [
frame.set_maximized(!frame.info().window_info.maximized); title_bar_rect.left_bottom() + vec2(1.0, 0.0),
} else if title_bar_response.is_pointer_button_down_on() { title_bar_rect.right_bottom() + vec2(-1.0, 0.0),
frame.drag_window(); ],
} ui.visuals().widgets.noninteractive.bg_stroke,
);
ui.allocate_ui_at_rect(title_bar_rect, |ui| {
ui.horizontal_centered(|ui| { // Interact with the title bar (drag to move window):
ui.spacing_mut().item_spacing.x = 0.0; if title_bar_response.double_clicked() {
ui.visuals_mut().button_frame = false; frame.set_maximized(!frame.info().window_info.maximized);
} else if title_bar_response.is_pointer_button_down_on() {
let close_response = ui frame.drag_window();
.add(Button::new(RichText::new("❌").size(button_height))) }
.on_hover_text("Close the window");
if close_response.clicked() { ui.allocate_ui_at_rect(title_bar_rect, |ui| {
frame.close(); ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
} ui.spacing_mut().item_spacing.x = 0.0;
ui.visuals_mut().button_frame = false;
let minimized_response = ui ui.add_space(8.0);
.add(Button::new(RichText::new("🗕").size(button_height))) close_maximize_minimize(ui, frame);
.on_hover_text("Minimize the window"); });
if minimized_response.clicked() { });
frame.set_minimized(true); }
}
/// Show some close/maximize/minimize buttons for the native window.
if frame.info().window_info.maximized { fn close_maximize_minimize(ui: &mut egui::Ui, frame: &mut eframe::Frame) {
let maximized_response = ui use egui::{Button, RichText};
.add(Button::new(RichText::new("🗖").size(button_height)))
.on_hover_text("Restore window"); let button_height = 12.0;
if maximized_response.clicked() {
frame.set_maximized(false); let close_response = ui
} .add(Button::new(RichText::new("❌").size(button_height)))
} else { .on_hover_text("Close the window");
let maximized_response = ui if close_response.clicked() {
.add(Button::new(RichText::new("🗗").size(button_height))) frame.close();
.on_hover_text("Maximize window"); }
if maximized_response.clicked() {
frame.set_maximized(true); if frame.info().window_info.maximized {
} let maximized_response = ui
} .add(Button::new(RichText::new("🗗").size(button_height)))
}); .on_hover_text("Restore window");
}); if maximized_response.clicked() {
frame.set_maximized(false);
// Add the contents: }
let content_rect = { } else {
let mut rect = rect; let maximized_response = ui
rect.min.y = title_bar_rect.max.y; .add(Button::new(RichText::new("🗗").size(button_height)))
rect .on_hover_text("Maximize window");
} if maximized_response.clicked() {
.shrink(4.0); frame.set_maximized(true);
let mut content_ui = ui.child_ui(content_rect, *ui.layout()); }
add_contents(&mut content_ui); }
});
let minimized_response = ui
.add(Button::new(RichText::new("🗕").size(button_height)))
.on_hover_text("Minimize the window");
if minimized_response.clicked() {
frame.set_minimized(true);
}
} }