Layout::left_to_right/right_to_left now takes the valign as argument

Previous default was `Align::Center`.

Closes https://github.com/emilk/egui/issues/1040
Closes https://github.com/emilk/egui/issues/1836
Closes https://github.com/emilk/egui/pull/1837
This commit is contained in:
Emil Ernerfeldt 2022-07-22 11:02:26 +02:00
parent 9f1f0a9038
commit 41f31116ce
8 changed files with 29 additions and 29 deletions

View file

@ -17,6 +17,7 @@ NOTE: [`epaint`](epaint/CHANGELOG.md), [`eframe`](eframe/CHANGELOG.md), [`egui-w
### Changed ### Changed
* `PaintCallback` shapes now require the whole callback to be put in an `Arc<dyn Any>` with the value being a backend-specific callback type. ([#1684](https://github.com/emilk/egui/pull/1684)) * `PaintCallback` shapes now require the whole callback to be put in an `Arc<dyn Any>` with the value being a backend-specific callback type. ([#1684](https://github.com/emilk/egui/pull/1684))
* Replaced `needs_repaint` in `FullOutput` with `repaint_after`. Used to force repaint after the set duration in reactive mode.([#1694](https://github.com/emilk/egui/pull/1694)). * Replaced `needs_repaint` in `FullOutput` with `repaint_after`. Used to force repaint after the set duration in reactive mode.([#1694](https://github.com/emilk/egui/pull/1694)).
* `Layout::left_to_right` and `Layout::right_to_left` now takes the vertical align as an argument. Previous default was `Align::Center`.
### Fixed 🐛 ### Fixed 🐛
* Fixed `ImageButton`'s changing background padding on hover ([#1595](https://github.com/emilk/egui/pull/1595)). * Fixed `ImageButton`'s changing background padding on hover ([#1595](https://github.com/emilk/egui/pull/1595)).

View file

@ -108,7 +108,7 @@ impl Direction {
/// ///
/// ``` /// ```
/// # egui::__run_test_ui(|ui| { /// # egui::__run_test_ui(|ui| {
/// ui.with_layout(egui::Layout::right_to_left(), |ui| { /// ui.with_layout(egui::Layout::right_to_left(egui::Align::TOP), |ui| {
/// ui.label("world!"); /// ui.label("world!");
/// ui.label("Hello"); /// ui.label("Hello");
/// }); /// });
@ -153,30 +153,30 @@ impl Default for Layout {
impl Layout { impl Layout {
/// Place elements horizontally, left to right. /// Place elements horizontally, left to right.
/// ///
/// Elements will be centered vertically. /// The `valign` parameter controls how to align elements vertically.
#[inline(always)] #[inline(always)]
pub fn left_to_right() -> Self { pub fn left_to_right(valing: Align) -> Self {
Self { Self {
main_dir: Direction::LeftToRight, main_dir: Direction::LeftToRight,
main_wrap: false, main_wrap: false,
main_align: Align::Center, // looks best to e.g. center text within a button main_align: Align::Center, // looks best to e.g. center text within a button
main_justify: false, main_justify: false,
cross_align: Align::Center, cross_align: valing,
cross_justify: false, cross_justify: false,
} }
} }
/// Place elements horizontally, right to left. /// Place elements horizontally, right to left.
/// ///
/// Elements will be centered vertically. /// The `valign` parameter controls how to align elements vertically.
#[inline(always)] #[inline(always)]
pub fn right_to_left() -> Self { pub fn right_to_left(valing: Align) -> Self {
Self { Self {
main_dir: Direction::RightToLeft, main_dir: Direction::RightToLeft,
main_wrap: false, main_wrap: false,
main_align: Align::Center, // looks best to e.g. center text within a button main_align: Align::Center, // looks best to e.g. center text within a button
main_justify: false, main_justify: false,
cross_align: Align::Center, cross_align: valing,
cross_justify: false, cross_justify: false,
} }
} }
@ -185,34 +185,34 @@ impl Layout {
/// ///
/// Use the provided horizontal alignmen. /// Use the provided horizontal alignmen.
#[inline(always)] #[inline(always)]
pub fn top_down(cross_align: Align) -> Self { pub fn top_down(halign: Align) -> Self {
Self { Self {
main_dir: Direction::TopDown, main_dir: Direction::TopDown,
main_wrap: false, main_wrap: false,
main_align: Align::Center, // looks best to e.g. center text within a button main_align: Align::Center, // looks best to e.g. center text within a button
main_justify: false, main_justify: false,
cross_align, cross_align: halign,
cross_justify: false, cross_justify: false,
} }
} }
/// Top-down layout justifed so that buttons etc fill the full available width. /// Top-down layout justifed so that buttons etc fill the full available width.
#[inline(always)] #[inline(always)]
pub fn top_down_justified(cross_align: Align) -> Self { pub fn top_down_justified(halign: Align) -> Self {
Self::top_down(cross_align).with_cross_justify(true) Self::top_down(halign).with_cross_justify(true)
} }
/// Place elements vertically, bottom up. /// Place elements vertically, bottom up.
/// ///
/// Use the provided horizontal alignmen. /// Use the provided horizontal alignmen.
#[inline(always)] #[inline(always)]
pub fn bottom_up(cross_align: Align) -> Self { pub fn bottom_up(halign: Align) -> Self {
Self { Self {
main_dir: Direction::BottomUp, main_dir: Direction::BottomUp,
main_wrap: false, main_wrap: false,
main_align: Align::Center, // looks best to e.g. center text within a button main_align: Align::Center, // looks best to e.g. center text within a button
main_justify: false, main_justify: false,
cross_align, cross_align: halign,
cross_justify: false, cross_justify: false,
} }
} }

View file

@ -1817,9 +1817,9 @@ impl Ui {
) -> InnerResponse<R> { ) -> InnerResponse<R> {
let initial_size = self.available_size_before_wrap(); let initial_size = self.available_size_before_wrap();
let layout = if self.placer.prefer_right_to_left() { let layout = if self.placer.prefer_right_to_left() {
Layout::right_to_left() Layout::right_to_left(Align::Center)
} else { } else {
Layout::left_to_right() Layout::left_to_right(Align::Center)
} }
.with_cross_align(Align::Center); .with_cross_align(Align::Center);
self.allocate_ui_with_layout_dyn(initial_size, layout, Box::new(add_contents)) self.allocate_ui_with_layout_dyn(initial_size, layout, Box::new(add_contents))
@ -1832,9 +1832,9 @@ impl Ui {
) -> InnerResponse<R> { ) -> InnerResponse<R> {
let initial_size = self.available_size_before_wrap(); let initial_size = self.available_size_before_wrap();
let layout = if self.placer.prefer_right_to_left() { let layout = if self.placer.prefer_right_to_left() {
Layout::right_to_left() Layout::right_to_left(Align::Center)
} else { } else {
Layout::left_to_right() Layout::left_to_right(Align::Center)
} }
.with_cross_align(Align::Min); .with_cross_align(Align::Min);
self.allocate_ui_with_layout_dyn(initial_size, layout, Box::new(add_contents)) self.allocate_ui_with_layout_dyn(initial_size, layout, Box::new(add_contents))
@ -1873,9 +1873,9 @@ impl Ui {
); );
let layout = if self.placer.prefer_right_to_left() { let layout = if self.placer.prefer_right_to_left() {
Layout::right_to_left() Layout::right_to_left(Align::Center)
} else { } else {
Layout::left_to_right() Layout::left_to_right(Align::Center)
} }
.with_main_wrap(main_wrap); .with_main_wrap(main_wrap);
@ -1944,15 +1944,16 @@ impl Ui {
/// ///
/// ``` /// ```
/// # egui::__run_test_ui(|ui| { /// # egui::__run_test_ui(|ui| {
/// ui.with_layout(egui::Layout::right_to_left(), |ui| { /// ui.with_layout(egui::Layout::right_to_left(egui::Align::TOP), |ui| {
/// ui.label("world!"); /// ui.label("world!");
/// ui.label("Hello"); /// ui.label("Hello");
/// }); /// });
/// # }); /// # });
/// ``` /// ```
/// ///
/// See also [`Self::allocate_ui_with_layout`], /// If you don't want to use up all available space, use [`Self::allocate_ui_with_layout`].
/// and the helpers [`Self::horizontal`], [`Self::vertical`], etc. ///
/// See also the helpers [`Self::horizontal`], [`Self::vertical`], etc.
#[inline] #[inline]
pub fn with_layout<R>( pub fn with_layout<R>(
&mut self, &mut self,

View file

@ -285,7 +285,7 @@ impl WrapApp {
} }
self.state.selected_anchor = selected_anchor; self.state.selected_anchor = selected_anchor;
ui.with_layout(egui::Layout::right_to_left(), |ui| { ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
if false { if false {
// TODO(emilk): fix the overlap on small screens // TODO(emilk): fix the overlap on small screens
if clock_button(ui, crate::seconds_since_midnight()).clicked() { if clock_button(ui, crate::seconds_since_midnight()).clicked() {

View file

@ -221,7 +221,7 @@ impl DemoWindows {
} }
}); });
ui.with_layout(egui::Layout::right_to_left(), |ui| { ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
use egui::special_emojis::{GITHUB, TWITTER}; use egui::special_emojis::{GITHUB, TWITTER};
ui.hyperlink_to( ui.hyperlink_to(
egui::RichText::new(TWITTER).size(font_size), egui::RichText::new(TWITTER).size(font_size),

View file

@ -25,7 +25,7 @@ pub fn password_ui(ui: &mut egui::Ui, password: &mut String) -> egui::Response {
// Process ui, change a local copy of the state // Process ui, change a local copy of the state
// We want TextEdit to fill entire space, and have button after that, so in that case we can // We want TextEdit to fill entire space, and have button after that, so in that case we can
// change direction to right_to_left. // change direction to right_to_left.
let result = ui.with_layout(egui::Layout::right_to_left(), |ui| { let result = ui.with_layout(egui::Layout::right_to_left(egui::Align::Center), |ui| {
// Toggle the `show_plaintext` bool with a button: // Toggle the `show_plaintext` bool with a button:
let response = ui let response = ui
.add(egui::SelectableLabel::new(show_plaintext, "👁")) .add(egui::SelectableLabel::new(show_plaintext, "👁"))

View file

@ -96,7 +96,7 @@ impl TableDemo {
TableBuilder::new(ui) TableBuilder::new(ui)
.striped(true) .striped(true)
.cell_layout(egui::Layout::left_to_right().with_cross_align(egui::Align::Center)) .cell_layout(egui::Layout::left_to_right(egui::Align::Center))
.column(Size::initial(60.0).at_least(40.0)) .column(Size::initial(60.0).at_least(40.0))
.column(Size::initial(60.0).at_least(40.0)) .column(Size::initial(60.0).at_least(40.0))
.column(Size::remainder().at_least(60.0)) .column(Size::remainder().at_least(60.0))

View file

@ -12,9 +12,7 @@ pub fn easy_mark_it<'em>(ui: &mut Ui, items: impl Iterator<Item = easy_mark::Ite
ui.spacing().interact_size.y, // Assume there will be ui.spacing().interact_size.y, // Assume there will be
); );
let layout = Layout::left_to_right() let layout = Layout::left_to_right(Align::BOTTOM).with_main_wrap(true);
.with_main_wrap(true)
.with_cross_align(Align::BOTTOM);
ui.allocate_ui_with_layout(initial_size, layout, |ui| { ui.allocate_ui_with_layout(initial_size, layout, |ui| {
ui.spacing_mut().item_spacing.x = 0.0; ui.spacing_mut().item_spacing.x = 0.0;