migrations/egui
1
0
Fork 0
mirror of https://github.com/emilk/egui.git synced 2026-06-28 07:23:13 -04:00
Code Activity

Users can add button to the tab bar

Browse Source
This commit is contained in:
Emil Ernerfeldt
2023-05-04 15:42:40 +02:00
parent f2d6885a6b
commit 051ec14b98
3 changed files with 70 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
crates/egui_extras/src/dock/behavior.rs
View File

@@ -69,7 +69,15 @@ pub trait Behavior<Leaf> {
true
}
// ---
/// Adds some UI to the top right of the tab bar.
/// You can use this to, for instance, add a button for adding new tabs.
fn top_bar_rtl_ui(&mut self, _ui: &mut Ui, _node_id: NodeId) {
// if ui.button("➕").clicked() {
// // TODO: add a new thing
// }
}
// --------
// Settings:
/// The height of the bar holding tab names.
@@ -102,16 +110,18 @@ pub trait Behavior<Leaf> {
/// The background color of the tab bar
fn tab_bar_color(&self, visuals: &Visuals) -> Color32 {
(Rgba::from(visuals.window_fill()) * Rgba::from_gray(0.7)).into()
if visuals.dark_mode {
Color32::BLACK
} else {
(Rgba::from(visuals.window_fill()) * Rgba::from_gray(0.8)).into()
}
}
fn tab_bg_color(&self, visuals: &Visuals, active: bool) -> Color32 {
if active {
// blend it with the tab contents:
visuals.window_fill()
visuals.window_fill() // same as the tab contents
} else {
// fade into background:
self.tab_bar_color(visuals)
Color32::TRANSPARENT // fade into background
}
}

57
crates/egui_extras/src/dock/branch/tabs.rs
View File

@@ -19,6 +19,14 @@ impl Tabs {
Self { children, active }
}
pub fn add_child(&mut self, child: NodeId) {
self.children.push(child);
}
pub fn set_active(&mut self, child: NodeId) {
self.active = child;
}
pub fn layout<Leaf>(
&self,
nodes: &mut Nodes<Leaf>,
@@ -73,39 +81,46 @@ impl Tabs {
let tab_bar_height = behavior.tab_bar_height(ui.style());
let tab_bar_rect = rect.split_top_bottom_at_y(rect.top() + tab_bar_height).0;
let mut tab_bar_ui = ui.child_ui(tab_bar_rect, *ui.layout());
let mut ui = ui.child_ui(tab_bar_rect, *ui.layout());
let mut button_rects = HashMap::new();
let mut dragged_index = None;
tab_bar_ui.horizontal(|ui| {
ui.painter()
.rect_filled(ui.max_rect(), 0.0, behavior.tab_bar_color(ui.visuals()));
ui.painter()
.rect_filled(ui.max_rect(), 0.0, behavior.tab_bar_color(ui.visuals()));
for (i, &child_id) in self.children.iter().enumerate() {
let is_being_dragged = is_being_dragged(ui.ctx(), child_id);
ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
behavior.top_bar_rtl_ui(ui, node_id);
let selected = child_id == self.active;
let id = child_id.id();
ui.with_layout(egui::Layout::left_to_right(egui::Align::Center), |ui| {
for (i, &child_id) in self.children.iter().enumerate() {
let is_being_dragged = is_being_dragged(ui.ctx(), child_id);
let response = behavior.tab_ui(nodes, ui, id, child_id, selected, is_being_dragged);
let response = response.on_hover_cursor(egui::CursorIcon::Grab);
if response.clicked() {
next_active = child_id;
}
let selected = child_id == self.active;
let id = child_id.id();
if let Some(mouse_pos) = drop_context.mouse_pos {
if drop_context.dragged_node_id.is_some() && response.rect.contains(mouse_pos) {
// Expand this tab - maybe the user wants to drop something into it!
let response =
behavior.tab_ui(nodes, ui, id, child_id, selected, is_being_dragged);
let response = response.on_hover_cursor(egui::CursorIcon::Grab);
if response.clicked() {
next_active = child_id;
}
}
button_rects.insert(child_id, response.rect);
if is_being_dragged {
dragged_index = Some(i);
if let Some(mouse_pos) = drop_context.mouse_pos {
if drop_context.dragged_node_id.is_some()
&& response.rect.contains(mouse_pos)
{
// Expand this tab - maybe the user wants to drop something into it!
next_active = child_id;
}
}
button_rects.insert(child_id, response.rect);
if is_being_dragged {
dragged_index = Some(i);
}
}
}
});
});
// -----------

18
examples/dock/src/main.rs
View File

@@ -58,6 +58,7 @@ struct DockBehavior {
simplification_options: dock::SimplificationOptions,
tab_bar_height: f32,
gap_width: f32,
add_child_to: Option<dock::NodeId>,
}
impl Default for DockBehavior {
@@ -66,6 +67,7 @@ impl Default for DockBehavior {
simplification_options: Default::default(),
tab_bar_height: 20.0,
gap_width: 2.0,
add_child_to: None,
}
}
}
@@ -76,6 +78,7 @@ impl DockBehavior {
simplification_options,
tab_bar_height,
gap_width,
add_child_to: _,
} = self;
egui::Grid::new("behavior_ui")
@@ -118,6 +121,12 @@ impl dock::Behavior<View> for DockBehavior {
view.title.clone().into()
}
fn top_bar_rtl_ui(&mut self, ui: &mut egui::Ui, node_id: dock::NodeId) {
if ui.button("➕").clicked() {
self.add_child_to = Some(node_id);
}
}
// ---
// Settings:
@@ -208,6 +217,15 @@ impl eframe::App for MyApp {
ui.separator();
tree_ui(ui, &mut self.behavior, &mut self.dock.nodes, self.dock.root);
if let Some(parent) = self.behavior.add_child_to.take() {
let new_child = self.dock.nodes.insert_leaf(View::with_nr(666));
if let Some(dock::Node::Branch(dock::Branch::Tabs(tabs))) =
self.dock.nodes.get_mut(parent)
{
tabs.add_child(new_child);
tabs.set_active(new_child);
}
}
});
egui::CentralPanel::default().show(ctx, |ui| {