1
0
mirror of https://github.com/emilk/egui.git synced 2026-08-31 22:00:03 -04:00

Dynamic sized strips, tables, and date picker (#963)

This commit is contained in:
René Rössler
2022-03-31 21:13:25 +02:00
committed by GitHub
parent 95ff7ec000
commit 1d32670cf3
19 changed files with 1658 additions and 36 deletions

View File

@@ -0,0 +1,34 @@
mod button;
mod popup;
pub use button::DatePickerButton;
use chrono::{Date, Datelike, Duration, NaiveDate, Utc, Weekday};
#[derive(Debug)]
struct Week {
number: u8,
days: Vec<Date<Utc>>,
}
fn month_data(year: i32, month: u32) -> Vec<Week> {
let first = Date::from_utc(NaiveDate::from_ymd(year, month, 1), Utc);
let mut start = first;
while start.weekday() != Weekday::Mon {
start = start.checked_sub_signed(Duration::days(1)).unwrap();
}
let mut weeks = vec![];
let mut week = vec![];
while start < first || start.month() == first.month() || start.weekday() != Weekday::Mon {
week.push(start);
if start.weekday() == Weekday::Sun {
weeks.push(Week {
number: start.iso_week().week() as u8,
days: week.drain(..).collect(),
});
}
start = start.checked_add_signed(Duration::days(1)).unwrap();
}
weeks
}

View File

@@ -0,0 +1,132 @@
use super::popup::DatePickerPopup;
use chrono::{Date, Utc};
use egui::{Area, Button, Frame, Key, Order, RichText, Ui, Widget};
#[derive(Default, Clone)]
#[cfg_attr(feature = "persistence", derive(serde::Deserialize, serde::Serialize))]
pub(crate) struct DatePickerButtonState {
pub picker_visible: bool,
}
pub struct DatePickerButton<'a> {
selection: &'a mut Date<Utc>,
id_source: Option<&'a str>,
combo_boxes: bool,
arrows: bool,
calendar: bool,
calendar_week: bool,
}
impl<'a> DatePickerButton<'a> {
pub fn new(selection: &'a mut Date<Utc>) -> Self {
Self {
selection,
id_source: None,
combo_boxes: true,
arrows: true,
calendar: true,
calendar_week: true,
}
}
/// Add id source.
/// Must be set if multiple date picker buttons are in the same Ui.
pub fn id_source(mut self, id_source: &'a str) -> Self {
self.id_source = Some(id_source);
self
}
/// Show combo boxes in date picker popup. (Default: true)
pub fn combo_boxes(mut self, combo_boxes: bool) -> Self {
self.combo_boxes = combo_boxes;
self
}
/// Show arrows in date picker popup. (Default: true)
pub fn arrows(mut self, arrows: bool) -> Self {
self.arrows = arrows;
self
}
/// Show calendar in date picker popup. (Default: true)
pub fn calendar(mut self, calendar: bool) -> Self {
self.calendar = calendar;
self
}
/// Show calendar week in date picker popup. (Default: true)
pub fn calendar_week(mut self, week: bool) -> Self {
self.calendar_week = week;
self
}
}
impl<'a> Widget for DatePickerButton<'a> {
fn ui(self, ui: &mut Ui) -> egui::Response {
let id = ui.make_persistent_id(&self.id_source);
let mut button_state = ui
.memory()
.data
.get_persisted::<DatePickerButtonState>(id)
.unwrap_or_default();
let mut text = RichText::new(format!("{} 📆", self.selection.format("%Y-%m-%d")));
let visuals = ui.visuals().widgets.open;
if button_state.picker_visible {
text = text.color(visuals.text_color());
}
let mut button = Button::new(text);
if button_state.picker_visible {
button = button.fill(visuals.bg_fill).stroke(visuals.bg_stroke);
}
let button_response = ui.add(button);
if button_response.clicked() {
button_state.picker_visible = true;
ui.memory().data.insert_persisted(id, button_state.clone());
}
if button_state.picker_visible {
let width = 333.0;
let mut pos = button_response.rect.left_bottom();
let width_with_padding = width
+ ui.style().spacing.item_spacing.x
+ ui.style().spacing.window_margin.left
+ ui.style().spacing.window_margin.right;
if pos.x + width_with_padding > ui.clip_rect().right() {
pos.x = button_response.rect.right() - width_with_padding;
}
//TODO: Better positioning
let area_response = Area::new(ui.make_persistent_id(&self.id_source))
.order(Order::Foreground)
.fixed_pos(pos)
.show(ui.ctx(), |ui| {
let frame = Frame::popup(ui.style());
frame.show(ui, |ui| {
ui.set_min_width(width);
ui.set_max_width(width);
DatePickerPopup {
selection: self.selection,
button_id: id,
combo_boxes: self.combo_boxes,
arrows: self.arrows,
calendar: self.calendar,
calendar_week: self.calendar_week,
}
.draw(ui);
})
})
.response;
if !button_response.clicked()
&& (ui.input().key_pressed(Key::Escape) || area_response.clicked_elsewhere())
{
button_state.picker_visible = false;
ui.memory().data.insert_persisted(id, button_state);
}
}
button_response
}
}

View File

@@ -0,0 +1,363 @@
use super::{button::DatePickerButtonState, month_data};
use crate::{Size, StripBuilder, TableBuilder};
use chrono::{Date, Datelike, NaiveDate, Utc, Weekday};
use egui::{Align, Button, Color32, ComboBox, Direction, Id, Label, Layout, RichText, Ui, Vec2};
#[derive(Default, Clone)]
#[cfg_attr(feature = "persistence", derive(serde::Deserialize, serde::Serialize))]
struct DatePickerPopupState {
year: i32,
month: u32,
day: u32,
setup: bool,
}
impl DatePickerPopupState {
fn last_day_of_month(&self) -> u32 {
let date: Date<Utc> = Date::from_utc(NaiveDate::from_ymd(self.year, self.month, 1), Utc);
date.with_day(31)
.map(|_| 31)
.or_else(|| date.with_day(30).map(|_| 30))
.or_else(|| date.with_day(29).map(|_| 29))
.unwrap_or(28)
}
}
pub(crate) struct DatePickerPopup<'a> {
pub selection: &'a mut Date<Utc>,
pub button_id: Id,
pub combo_boxes: bool,
pub arrows: bool,
pub calendar: bool,
pub calendar_week: bool,
}
impl<'a> DatePickerPopup<'a> {
pub fn draw(&mut self, ui: &mut Ui) {
let id = ui.make_persistent_id("date_picker");
let today = chrono::offset::Utc::now().date();
let mut popup_state = ui
.memory()
.data
.get_persisted::<DatePickerPopupState>(id)
.unwrap_or_default();
if !popup_state.setup {
popup_state.year = self.selection.year();
popup_state.month = self.selection.month();
popup_state.day = self.selection.day();
popup_state.setup = true;
ui.memory().data.insert_persisted(id, popup_state.clone());
}
let weeks = month_data(popup_state.year, popup_state.month);
let mut close = false;
let height = 20.0;
let spacing = 2.0;
ui.spacing_mut().item_spacing = Vec2::splat(spacing);
StripBuilder::new(ui)
.sizes(
Size::Absolute(height),
match (self.combo_boxes, self.arrows) {
(true, true) => 2,
(true, false) | (false, true) => 1,
(false, false) => 0,
},
)
.sizes(
Size::Absolute((spacing + height) * (weeks.len() + 1) as f32),
if self.calendar { 1 } else { 0 },
)
.size(Size::Absolute(height))
.vertical(|mut strip| {
if self.combo_boxes {
strip.strip_clip(|builder| {
builder.sizes(Size::Remainder, 3).horizontal(|mut strip| {
strip.cell(|ui| {
ComboBox::from_id_source("date_picker_year")
.selected_text(popup_state.year.to_string())
.show_ui(ui, |ui| {
for year in today.year() - 5..today.year() + 10 {
if ui
.selectable_value(
&mut popup_state.year,
year,
year.to_string(),
)
.changed()
{
ui.memory()
.data
.insert_persisted(id, popup_state.clone());
}
}
});
});
strip.cell(|ui| {
ComboBox::from_id_source("date_picker_month")
.selected_text(popup_state.month.to_string())
.show_ui(ui, |ui| {
for month in 1..=12 {
if ui
.selectable_value(
&mut popup_state.month,
month,
month.to_string(),
)
.changed()
{
ui.memory()
.data
.insert_persisted(id, popup_state.clone());
}
}
});
});
strip.cell(|ui| {
ComboBox::from_id_source("date_picker_day")
.selected_text(popup_state.day.to_string())
.show_ui(ui, |ui| {
for day in 1..=popup_state.last_day_of_month() {
if ui
.selectable_value(
&mut popup_state.day,
day,
day.to_string(),
)
.changed()
{
ui.memory()
.data
.insert_persisted(id, popup_state.clone());
}
}
});
});
});
});
}
if self.arrows {
strip.strip(|builder| {
builder.sizes(Size::Remainder, 6).horizontal(|mut strip| {
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui
.button("<<<")
.on_hover_text("substract one year")
.clicked()
{
popup_state.year -= 1;
popup_state.day =
popup_state.day.min(popup_state.last_day_of_month());
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui
.button("<<")
.on_hover_text("substract one month")
.clicked()
{
popup_state.month -= 1;
if popup_state.month == 0 {
popup_state.month = 12;
popup_state.year -= 1;
}
popup_state.day =
popup_state.day.min(popup_state.last_day_of_month());
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button("<").on_hover_text("substract one day").clicked() {
popup_state.day -= 1;
if popup_state.day == 0 {
popup_state.month -= 1;
if popup_state.month == 0 {
popup_state.year -= 1;
popup_state.month = 12;
}
popup_state.day = popup_state.last_day_of_month();
}
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button(">").on_hover_text("add one day").clicked() {
popup_state.day += 1;
if popup_state.day > popup_state.last_day_of_month() {
popup_state.day = 1;
popup_state.month += 1;
if popup_state.month > 12 {
popup_state.month = 1;
popup_state.year += 1;
}
}
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button(">>").on_hover_text("add one month").clicked() {
popup_state.month += 1;
if popup_state.month > 12 {
popup_state.month = 1;
popup_state.year += 1;
}
popup_state.day =
popup_state.day.min(popup_state.last_day_of_month());
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button(">>>").on_hover_text("add one year").clicked() {
popup_state.year += 1;
popup_state.day =
popup_state.day.min(popup_state.last_day_of_month());
ui.memory().data.insert_persisted(id, popup_state.clone());
}
});
});
});
});
}
if self.calendar {
strip.cell(|ui| {
ui.spacing_mut().item_spacing = Vec2::new(1.0, 2.0);
TableBuilder::new(ui)
.scroll(false)
.columns(Size::Remainder, if self.calendar_week { 8 } else { 7 })
.header(height, |mut header| {
if self.calendar_week {
header.col(|ui| {
ui.with_layout(
Layout::centered_and_justified(Direction::TopDown),
|ui| {
ui.add(Label::new("Week"));
},
);
});
}
//TODO: Locale
for name in ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"] {
header.col(|ui| {
ui.with_layout(
Layout::centered_and_justified(Direction::TopDown),
|ui| {
ui.add(Label::new(name));
},
);
});
}
})
.body(|mut body| {
for week in weeks {
body.row(height, |mut row| {
if self.calendar_week {
row.col(|ui| {
ui.add(Label::new(week.number.to_string()));
});
}
for day in week.days {
row.col(|ui| {
ui.with_layout(
Layout::top_down_justified(Align::Center),
|ui| {
//TODO: Colors from egui style
let fill_color = if popup_state.year
== day.year()
&& popup_state.month == day.month()
&& popup_state.day == day.day()
{
ui.visuals().selection.bg_fill
} else if day.weekday() == Weekday::Sat
|| day.weekday() == Weekday::Sun
{
Color32::DARK_RED
} else {
Color32::BLACK
};
let text_color = if day == today {
Color32::RED
} else if day.month() == popup_state.month {
Color32::WHITE
} else {
Color32::from_gray(80)
};
let button = Button::new(
RichText::new(day.day().to_string())
.color(text_color),
)
.fill(fill_color);
if ui.add(button).clicked() {
popup_state.year = day.year();
popup_state.month = day.month();
popup_state.day = day.day();
ui.memory().data.insert_persisted(
id,
popup_state.clone(),
);
}
},
);
});
}
});
}
});
});
}
strip.strip(|builder| {
builder.sizes(Size::Remainder, 3).horizontal(|mut strip| {
strip.empty();
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button("Cancel").clicked() {
close = true;
}
});
});
strip.cell(|ui| {
ui.with_layout(Layout::top_down_justified(Align::Center), |ui| {
if ui.button("Save").clicked() {
*self.selection = Date::from_utc(
NaiveDate::from_ymd(
popup_state.year,
popup_state.month,
popup_state.day,
),
Utc,
);
close = true;
}
});
});
});
});
});
if close {
popup_state.setup = false;
ui.memory().data.insert_persisted(id, popup_state);
ui.memory()
.data
.get_persisted_mut_or_default::<DatePickerButtonState>(self.button_id)
.picker_visible = false;
}
}
}

162
egui_extras/src/layout.rs Normal file
View File

@@ -0,0 +1,162 @@
use egui::{Pos2, Rect, Response, Sense, Ui};
#[derive(Clone, Copy)]
pub(crate) enum CellSize {
/// Absolute size in points
Absolute(f32),
/// Take all available space
Remainder,
}
/// Cells are positioned in two dimensions, cells go in one direction and form lines.
///
/// In a strip there's only one line which goes in the direction of the strip:
///
/// In a horizontal strip, a `[StripLayout]` with horizontal `[CellDirection]` is used.
/// Its cells go from left to right inside this `[StripLayout]`.
///
/// In a table there's a `[StripLayout]` for each table row with a horizontal `[CellDirection]`.
/// Its cells go from left to right. And the lines go from top to bottom.
pub(crate) enum CellDirection {
/// Cells go from left to right
Horizontal,
/// Cells go from top to bottom
Vertical,
}
/// Positions cells in `[CellDirection]` and starts a new line on `[StripLayout::end_line]`
pub struct StripLayout<'l> {
ui: &'l mut Ui,
direction: CellDirection,
rect: Rect,
pos: Pos2,
max: Pos2,
}
impl<'l> StripLayout<'l> {
pub(crate) fn new(ui: &'l mut Ui, direction: CellDirection) -> Self {
let rect = ui.available_rect_before_wrap();
let pos = rect.left_top();
Self {
ui,
rect,
pos,
max: pos,
direction,
}
}
pub fn current_y(&self) -> f32 {
self.rect.top()
}
fn cell_rect(&self, width: &CellSize, height: &CellSize) -> Rect {
Rect {
min: self.pos,
max: Pos2 {
x: match width {
CellSize::Absolute(width) => self.pos.x + width,
CellSize::Remainder => self.rect.right() - self.ui.spacing().item_spacing.x,
},
y: match height {
CellSize::Absolute(height) => self.pos.y + height,
CellSize::Remainder => self.rect.bottom() - self.ui.spacing().item_spacing.y,
},
},
}
}
fn set_pos(&mut self, rect: Rect) {
match self.direction {
CellDirection::Horizontal => {
self.pos.x = rect.right() + self.ui.spacing().item_spacing.x;
}
CellDirection::Vertical => {
self.pos.y = rect.bottom() + self.ui.spacing().item_spacing.y;
}
}
self.max.x = self
.max
.x
.max(rect.right() + self.ui.spacing().item_spacing.x);
self.max.y = self
.max
.y
.max(rect.bottom() + self.ui.spacing().item_spacing.y);
}
pub(crate) fn empty(&mut self, width: CellSize, height: CellSize) {
self.set_pos(self.cell_rect(&width, &height));
}
pub(crate) fn add(
&mut self,
width: CellSize,
height: CellSize,
clip: bool,
add_contents: impl FnOnce(&mut Ui),
) -> Response {
let rect = self.cell_rect(&width, &height);
self.cell(rect, clip, add_contents);
self.set_pos(rect);
self.ui.allocate_rect(rect, Sense::click())
}
pub(crate) fn add_striped(
&mut self,
width: CellSize,
height: CellSize,
clip: bool,
add_contents: impl FnOnce(&mut Ui),
) -> Response {
let mut rect = self.cell_rect(&width, &height);
// Make sure we don't have a gap in the stripe background
*rect.top_mut() -= self.ui.spacing().item_spacing.y;
*rect.left_mut() -= self.ui.spacing().item_spacing.x;
self.ui
.painter()
.rect_filled(rect, 0.0, self.ui.visuals().faint_bg_color);
self.add(width, height, clip, add_contents)
}
/// only needed for layouts with multiple lines, like Table
pub fn end_line(&mut self) {
match self.direction {
CellDirection::Horizontal => {
self.pos.y = self.max.y;
self.pos.x = self.rect.left();
}
CellDirection::Vertical => {
self.pos.x = self.max.x;
self.pos.y = self.rect.top();
}
}
}
fn cell(&mut self, rect: Rect, clip: bool, add_contents: impl FnOnce(&mut Ui)) {
let mut child_ui = self.ui.child_ui(rect, *self.ui.layout());
if clip {
let mut clip_rect = child_ui.clip_rect();
clip_rect.min = clip_rect.min.max(rect.min);
clip_rect.max = clip_rect.max.min(rect.max);
child_ui.set_clip_rect(clip_rect);
}
add_contents(&mut child_ui);
}
/// Allocate the rect in [`Self::ui`] so that the scrollview knows about our size
pub fn allocate_rect(&mut self) -> Response {
let mut rect = self.rect;
rect.set_right(self.max.x);
rect.set_bottom(self.max.y);
self.ui.allocate_rect(rect, Sense::hover())
}
}

View File

@@ -3,6 +3,20 @@
#![allow(clippy::float_cmp)]
#![allow(clippy::manual_range_contains)]
#[cfg(feature = "chrono")]
mod datepicker;
pub mod image;
mod layout;
mod sizing;
mod strip;
mod table;
#[cfg(feature = "chrono")]
pub use crate::datepicker::DatePickerButton;
pub use crate::image::RetainedImage;
pub(crate) use crate::layout::StripLayout;
pub use crate::sizing::Size;
pub use crate::strip::*;
pub use crate::table::*;

120
egui_extras/src/sizing.rs Normal file
View File

@@ -0,0 +1,120 @@
/// Size hint for table column/strip cell
#[derive(Clone, Debug, Copy)]
pub enum Size {
/// Absolute size in points
Absolute(f32),
/// Relative size relative to all available space. Values must be in range `0.0..=1.0`
Relative(f32),
/// [`Size::Relative`] with a minimum size in points
RelativeMinimum {
/// Relative size relative to all available space. Values must be in range `0.0..=1.0`
relative: f32,
/// Absolute minimum size in points
minimum: f32,
},
/// Multiple remainders each get the same space
Remainder,
/// [`Size::Remainder`] with a minimum size in points
RemainderMinimum(f32),
}
#[derive(Clone)]
pub struct Sizing {
sizes: Vec<Size>,
}
impl Sizing {
pub fn new() -> Self {
Self { sizes: vec![] }
}
pub fn add(&mut self, size: Size) {
self.sizes.push(size);
}
pub fn into_lengths(self, length: f32, spacing: f32) -> Vec<f32> {
let mut remainders = 0;
let sum_non_remainder = self
.sizes
.iter()
.map(|size| match size {
Size::Absolute(absolute) => *absolute,
Size::Relative(relative) => {
assert!(*relative > 0.0, "Below 0.0 is not allowed.");
assert!(*relative <= 1.0, "Above 1.0 is not allowed.");
length * relative
}
Size::RelativeMinimum { relative, minimum } => {
assert!(*relative > 0.0, "Below 0.0 is not allowed.");
assert!(*relative <= 1.0, "Above 1.0 is not allowed.");
minimum.max(length * relative)
}
Size::Remainder | Size::RemainderMinimum(..) => {
remainders += 1;
0.0
}
})
.sum::<f32>()
+ spacing * (self.sizes.len() - 1) as f32;
let avg_remainder_length = if remainders == 0 {
0.0
} else {
let mut remainder_length = length - sum_non_remainder;
let avg_remainder_length = 0.0f32.max(remainder_length / remainders as f32).floor();
self.sizes.iter().for_each(|size| {
if let Size::RemainderMinimum(minimum) = size {
if *minimum > avg_remainder_length {
remainder_length -= minimum;
remainders -= 1;
}
}
});
if remainders > 0 {
0.0f32.max(remainder_length / remainders as f32)
} else {
0.0
}
};
self.sizes
.into_iter()
.map(|size| match size {
Size::Absolute(absolute) => absolute,
Size::Relative(relative) => length * relative,
Size::RelativeMinimum { relative, minimum } => minimum.max(length * relative),
Size::Remainder => avg_remainder_length,
Size::RemainderMinimum(minimum) => minimum.max(avg_remainder_length),
})
.collect()
}
}
impl From<Vec<Size>> for Sizing {
fn from(sizes: Vec<Size>) -> Self {
Self { sizes }
}
}
#[test]
fn test_sizing() {
let sizing: Sizing = vec![Size::RemainderMinimum(20.0), Size::Remainder].into();
assert_eq!(sizing.clone().into_lengths(50.0, 0.0), vec![25.0, 25.0]);
assert_eq!(sizing.clone().into_lengths(30.0, 0.0), vec![20.0, 10.0]);
assert_eq!(sizing.clone().into_lengths(20.0, 0.0), vec![20.0, 0.0]);
assert_eq!(sizing.clone().into_lengths(10.0, 0.0), vec![20.0, 0.0]);
assert_eq!(sizing.into_lengths(20.0, 10.0), vec![20.0, 0.0]);
let sizing: Sizing = vec![
Size::RelativeMinimum {
relative: 0.5,
minimum: 10.0,
},
Size::Absolute(10.0),
]
.into();
assert_eq!(sizing.clone().into_lengths(50.0, 0.0), vec![25.0, 10.0]);
assert_eq!(sizing.clone().into_lengths(30.0, 0.0), vec![15.0, 10.0]);
assert_eq!(sizing.clone().into_lengths(20.0, 0.0), vec![10.0, 10.0]);
assert_eq!(sizing.into_lengths(10.0, 0.0), vec![10.0, 10.0]);
}

183
egui_extras/src/strip.rs Normal file
View File

@@ -0,0 +1,183 @@
use crate::{
layout::{CellDirection, CellSize, StripLayout},
sizing::Sizing,
Size,
};
use egui::{Response, Ui};
/// Builder for creating a new [`Strip`].
///
/// This can be used to do dynamic layouts.
///
/// In contrast to normal egui behavior, strip cells do *not* grow with its children!
///
/// After adding size hints with `[Self::column]`/`[Self::columns]` the strip can be build with `[Self::horizontal]`/`[Self::vertical]`.
///
/// ### Example
/// ```
/// # egui::__run_test_ui(|ui| {
/// use egui_extras::{StripBuilder, Size};
/// StripBuilder::new(ui)
/// .size(Size::RemainderMinimum(100.0))
/// .size(Size::Absolute(40.0))
/// .vertical(|mut strip| {
/// strip.strip(|builder| {
/// builder.sizes(Size::Remainder, 2).horizontal(|mut strip| {
/// strip.cell(|ui| {
/// ui.label("Top Left");
/// });
/// strip.cell(|ui| {
/// ui.label("Top Right");
/// });
/// });
/// });
/// strip.cell(|ui| {
/// ui.label("Fixed");
/// });
/// });
/// # });
/// ```
pub struct StripBuilder<'a> {
ui: &'a mut Ui,
sizing: Sizing,
}
impl<'a> StripBuilder<'a> {
/// Create new strip builder.
pub fn new(ui: &'a mut Ui) -> Self {
let sizing = Sizing::new();
Self { ui, sizing }
}
/// Add size hint for one column/row.
pub fn size(mut self, size: Size) -> Self {
self.sizing.add(size);
self
}
/// Add size hint for several columns/rows at once.
pub fn sizes(mut self, size: Size, count: usize) -> Self {
for _ in 0..count {
self.sizing.add(size);
}
self
}
/// Build horizontal strip: Cells are positions from left to right.
/// Takes the available horizontal width, so there can't be anything right of the strip or the container will grow slowly!
///
/// Returns a `[egui::Response]` for hover events.
pub fn horizontal<F>(self, strip: F) -> Response
where
F: for<'b> FnOnce(Strip<'a, 'b>),
{
let widths = self.sizing.into_lengths(
self.ui.available_rect_before_wrap().width() - self.ui.spacing().item_spacing.x,
self.ui.spacing().item_spacing.x,
);
let mut layout = StripLayout::new(self.ui, CellDirection::Horizontal);
strip(Strip {
layout: &mut layout,
direction: CellDirection::Horizontal,
sizes: &widths,
});
layout.allocate_rect()
}
/// Build vertical strip: Cells are positions from top to bottom.
/// Takes the full available vertical height, so there can't be anything below of the strip or the container will grow slowly!
///
/// Returns a `[egui::Response]` for hover events.
pub fn vertical<F>(self, strip: F) -> Response
where
F: for<'b> FnOnce(Strip<'a, 'b>),
{
let heights = self.sizing.into_lengths(
self.ui.available_rect_before_wrap().height() - self.ui.spacing().item_spacing.y,
self.ui.spacing().item_spacing.y,
);
let mut layout = StripLayout::new(self.ui, CellDirection::Vertical);
strip(Strip {
layout: &mut layout,
direction: CellDirection::Vertical,
sizes: &heights,
});
layout.allocate_rect()
}
}
/// A Strip of cells which go in one direction. Each cell has a fixed size.
/// In contrast to normal egui behavior, strip cells do *not* grow with its children!
pub struct Strip<'a, 'b> {
layout: &'b mut StripLayout<'a>,
direction: CellDirection,
sizes: &'b [f32],
}
impl<'a, 'b> Strip<'a, 'b> {
fn next_cell_size(&mut self) -> (CellSize, CellSize) {
let size = self.sizes[0];
self.sizes = &self.sizes[1..];
match self.direction {
CellDirection::Horizontal => (CellSize::Absolute(size), CellSize::Remainder),
CellDirection::Vertical => (CellSize::Remainder, CellSize::Absolute(size)),
}
}
/// Add empty cell
pub fn empty(&mut self) {
assert!(
!self.sizes.is_empty(),
"Tried using more strip cells than available."
);
let (width, height) = self.next_cell_size();
self.layout.empty(width, height);
}
fn cell_impl(&mut self, clip: bool, add_contents: impl FnOnce(&mut Ui)) {
assert!(
!self.sizes.is_empty(),
"Tried using more strip cells than available."
);
let (width, height) = self.next_cell_size();
self.layout.add(width, height, clip, add_contents);
}
/// Add cell, content is wrapped
pub fn cell(&mut self, add_contents: impl FnOnce(&mut Ui)) {
self.cell_impl(false, add_contents);
}
/// Add cell, content is clipped
pub fn cell_clip(&mut self, add_contents: impl FnOnce(&mut Ui)) {
self.cell_impl(true, add_contents);
}
fn strip_impl(&mut self, clip: bool, strip_builder: impl FnOnce(StripBuilder<'_>)) {
self.cell_impl(clip, |ui| {
strip_builder(StripBuilder::new(ui));
});
}
/// Add strip as cell
pub fn strip(&mut self, strip_builder: impl FnOnce(StripBuilder<'_>)) {
self.strip_impl(false, strip_builder);
}
/// Add strip as cell, content is clipped
pub fn strip_clip(&mut self, strip_builder: impl FnOnce(StripBuilder<'_>)) {
self.strip_impl(true, strip_builder);
}
}
impl<'a, 'b> Drop for Strip<'a, 'b> {
fn drop(&mut self) {
while !self.sizes.is_empty() {
self.empty();
}
}
}

335
egui_extras/src/table.rs Normal file
View File

@@ -0,0 +1,335 @@
//! Table view with (optional) fixed header and scrolling body.
//! Cell widths are precalculated with given size hints so we can have tables like this:
//! | fixed size | all available space/minimum | 30% of available width | fixed size |
//! Takes all available height, so if you want something below the table, put it in a strip.
use crate::{
layout::{CellDirection, CellSize},
sizing::Sizing,
Size, StripLayout,
};
use egui::{Response, Ui};
use std::cmp;
/// Builder for a [`Table`] with (optional) fixed header and scrolling body.
///
/// Cell widths are precalculated with given size hints so we can have tables like this:
///
/// | fixed size | all available space/minimum | 30% of available width | fixed size |
///
/// In contrast to normal egui behavior, columns/rows do *not* grow with its children!
/// Takes all available height, so if you want something below the table, put it in a strip.
///
/// ### Example
/// ```
/// # egui::__run_test_ui(|ui| {
/// use egui_extras::{TableBuilder, Size};
/// TableBuilder::new(ui)
/// .column(Size::RemainderMinimum(100.0))
/// .column(Size::Absolute(40.0))
/// .header(20.0, |mut header| {
/// header.col(|ui| {
/// ui.heading("Growing");
/// });
/// header.col(|ui| {
/// ui.heading("Fixed");
/// });
/// })
/// .body(|mut body| {
/// body.row(30.0, |mut row| {
/// row.col(|ui| {
/// ui.label("first row growing cell");
/// });
/// row.col_clip(|ui| {
/// ui.button("action");
/// });
/// });
/// });
/// # });
/// ```
pub struct TableBuilder<'a> {
ui: &'a mut Ui,
sizing: Sizing,
scroll: bool,
striped: bool,
}
impl<'a> TableBuilder<'a> {
pub fn new(ui: &'a mut Ui) -> Self {
let sizing = Sizing::new();
Self {
ui,
sizing,
scroll: true,
striped: false,
}
}
/// Enable scrollview in body (default: true)
pub fn scroll(mut self, scroll: bool) -> Self {
self.scroll = scroll;
self
}
/// Enable striped row background (default: false)
pub fn striped(mut self, striped: bool) -> Self {
self.striped = striped;
self
}
/// Add size hint for column
pub fn column(mut self, width: Size) -> Self {
self.sizing.add(width);
self
}
/// Add size hint for several columns at once.
pub fn columns(mut self, size: Size, count: usize) -> Self {
for _ in 0..count {
self.sizing.add(size);
}
self
}
fn available_width(&self) -> f32 {
self.ui.available_rect_before_wrap().width()
- 2.0 * self.ui.spacing().item_spacing.x
- if self.scroll {
self.ui.spacing().scroll_bar_width
} else {
0.0
}
}
/// Create a header row which always stays visible and at the top
pub fn header(self, height: f32, header: impl FnOnce(TableRow<'_, '_>)) -> Table<'a> {
let available_width = self.available_width();
let widths = self
.sizing
.into_lengths(available_width, self.ui.spacing().item_spacing.x);
let ui = self.ui;
{
let mut layout = StripLayout::new(ui, CellDirection::Horizontal);
header(TableRow {
layout: &mut layout,
widths: &widths,
striped: false,
height,
clicked: false,
});
layout.allocate_rect();
}
Table {
ui,
widths,
scroll: self.scroll,
striped: self.striped,
}
}
/// Create table body without a header row
pub fn body<F>(self, body: F)
where
F: for<'b> FnOnce(TableBody<'b>),
{
let available_width = self.available_width();
let widths = self
.sizing
.into_lengths(available_width, self.ui.spacing().item_spacing.x);
Table {
ui: self.ui,
widths,
scroll: self.scroll,
striped: self.striped,
}
.body(body);
}
}
/// Table struct which can construct a [`TableBody`].
///
/// Is created by [`TableBuilder`] by either calling [`TableBuilder::body`] or after creating a header row with [`TableBuilder::header`].
pub struct Table<'a> {
ui: &'a mut Ui,
widths: Vec<f32>,
scroll: bool,
striped: bool,
}
impl<'a> Table<'a> {
/// Create table body after adding a header row
pub fn body<F>(self, body: F)
where
F: for<'b> FnOnce(TableBody<'b>),
{
let Table {
ui,
widths,
scroll,
striped,
} = self;
let start_y = ui.available_rect_before_wrap().top();
let end_y = ui.available_rect_before_wrap().bottom();
egui::ScrollArea::new([false, scroll]).show(ui, move |ui| {
let layout = StripLayout::new(ui, CellDirection::Horizontal);
body(TableBody {
layout,
widths,
striped,
row_nr: 0,
start_y,
end_y,
});
});
}
}
/// The body of a table.
/// Is created by calling `body` on a [`Table`] (after adding a header row) or [`TableBuilder`] (without a header row).
pub struct TableBody<'a> {
layout: StripLayout<'a>,
widths: Vec<f32>,
striped: bool,
row_nr: usize,
start_y: f32,
end_y: f32,
}
impl<'a> TableBody<'a> {
/// Add rows with same height.
///
/// Is a lot more performant than adding each individual row as non visible rows must not be rendered
pub fn rows(mut self, height: f32, rows: usize, mut row: impl FnMut(usize, TableRow<'_, '_>)) {
let delta = self.layout.current_y() - self.start_y;
let mut start = 0;
if delta < 0.0 {
start = (-delta / height).floor() as usize;
let skip_height = start as f32 * height;
TableRow {
layout: &mut self.layout,
widths: &self.widths,
striped: false,
height: skip_height,
clicked: false,
}
.col(|_| ()); // advances the cursor
}
let max_height = self.end_y - self.start_y;
let count = (max_height / height).ceil() as usize;
let end = cmp::min(start + count, rows);
for idx in start..end {
row(
idx,
TableRow {
layout: &mut self.layout,
widths: &self.widths,
striped: self.striped && idx % 2 == 0,
height,
clicked: false,
},
);
}
if rows - end > 0 {
let skip_height = (rows - end) as f32 * height;
TableRow {
layout: &mut self.layout,
widths: &self.widths,
striped: false,
height: skip_height,
clicked: false,
}
.col(|_| ()); // advances the cursor
}
}
/// Add row with individual height
pub fn row(&mut self, height: f32, row: impl FnOnce(TableRow<'a, '_>)) {
row(TableRow {
layout: &mut self.layout,
widths: &self.widths,
striped: self.striped && self.row_nr % 2 == 0,
height,
clicked: false,
});
self.row_nr += 1;
}
}
impl<'a> Drop for TableBody<'a> {
fn drop(&mut self) {
self.layout.allocate_rect();
}
}
/// The row of a table.
/// Is created by [`TableRow`] for each created [`TableBody::row`] or each visible row in rows created by calling [`TableBody::rows`].
pub struct TableRow<'a, 'b> {
layout: &'b mut StripLayout<'a>,
widths: &'b [f32],
striped: bool,
height: f32,
clicked: bool,
}
impl<'a, 'b> TableRow<'a, 'b> {
/// Check if row was clicked
pub fn clicked(&self) -> bool {
self.clicked
}
/// Add column, content is wrapped
pub fn col(&mut self, add_contents: impl FnOnce(&mut Ui)) -> Response {
self.column(false, add_contents)
}
/// Add column, content is clipped
pub fn col_clip(&mut self, add_contents: impl FnOnce(&mut Ui)) -> Response {
self.column(true, add_contents)
}
fn column(&mut self, clip: bool, add_contents: impl FnOnce(&mut Ui)) -> Response {
assert!(
!self.widths.is_empty(),
"Tried using more table columns than available."
);
let width = self.widths[0];
self.widths = &self.widths[1..];
let width = CellSize::Absolute(width);
let height = CellSize::Absolute(self.height);
let response;
if self.striped {
response = self.layout.add_striped(width, height, clip, add_contents);
} else {
response = self.layout.add(width, height, clip, add_contents);
}
if response.clicked() {
self.clicked = true;
}
response
}
}
impl<'a, 'b> Drop for TableRow<'a, 'b> {
fn drop(&mut self) {
self.layout.end_line();
}
}