Merge pull request #2423 from iced-rs/center-widget-helper

Introduce `center` widget helper
iced-rs · May 3, 2024 · 38cf87c · 38cf87c
2 parents 1cefe6b + 4c658c4
commit 38cf87c
Show file tree

Hide file tree

Showing 38 changed files with 253 additions and 338 deletions.
diff --git a/examples/checkbox/src/main.rs b/examples/checkbox/src/main.rs
@@ -1,5 +1,5 @@
-use iced::widget::{checkbox, column, container, row, text};
-use iced::{Element, Font, Length};
+use iced::widget::{center, checkbox, column, row, text};
+use iced::{Element, Font};
 
 const ICON_FONT: Font = Font::with_name("icons");
 
@@ -68,11 +68,6 @@ impl Example {
         let content =
             column![default_checkbox, checkboxes, custom_checkbox].spacing(20);
 
-        container(content)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(content).into()
     }
 }
diff --git a/examples/combo_box/src/main.rs b/examples/combo_box/src/main.rs
@@ -1,5 +1,5 @@
 use iced::widget::{
-    column, combo_box, container, scrollable, text, vertical_space,
+    center, column, combo_box, scrollable, text, vertical_space,
 };
 use iced::{Alignment, Element, Length};
 
@@ -68,12 +68,7 @@ impl Example {
         .align_items(Alignment::Center)
         .spacing(10);
 
-        container(scrollable(content))
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(scrollable(content)).into()
     }
 }
 

diff --git a/examples/component/src/main.rs b/examples/component/src/main.rs
@@ -1,5 +1,5 @@
-use iced::widget::container;
-use iced::{Element, Length};
+use iced::widget::center;
+use iced::Element;
 
 use numeric_input::numeric_input;
 
@@ -27,10 +27,8 @@ impl Component {
     }
 
     fn view(&self) -> Element<Message> {
-        container(numeric_input(self.value, Message::NumericInputChanged))
+        center(numeric_input(self.value, Message::NumericInputChanged))
             .padding(20)
-            .height(Length::Fill)
-            .center_y()
             .into()
     }
 }

diff --git a/examples/custom_quad/src/main.rs b/examples/custom_quad/src/main.rs
@@ -81,8 +81,8 @@ mod quad {
     }
 }
 
-use iced::widget::{column, container, slider, text};
-use iced::{Alignment, Color, Element, Length, Shadow, Vector};
+use iced::widget::{center, column, slider, text};
+use iced::{Alignment, Color, Element, Shadow, Vector};
 
 pub fn main() -> iced::Result {
     iced::run("Custom Quad - Iced", Example::update, Example::view)
@@ -187,12 +187,7 @@ impl Example {
         .max_width(500)
         .align_items(Alignment::Center);
 
-        container(content)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(content).into()
     }
 }
 

diff --git a/examples/custom_shader/src/main.rs b/examples/custom_shader/src/main.rs
@@ -4,7 +4,7 @@ use scene::Scene;
 
 use iced::time::Instant;
 use iced::widget::shader::wgpu;
-use iced::widget::{checkbox, column, container, row, shader, slider, text};
+use iced::widget::{center, checkbox, column, row, shader, slider, text};
 use iced::window;
 use iced::{Alignment, Color, Element, Length, Subscription};
 
@@ -123,12 +123,7 @@ impl IcedCubes {
         let shader =
             shader(&self.scene).width(Length::Fill).height(Length::Fill);
 
-        container(column![shader, controls].align_items(Alignment::Center))
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(column![shader, controls].align_items(Alignment::Center)).into()
     }
 
     fn subscription(&self) -> Subscription<Message> {

diff --git a/examples/custom_widget/src/main.rs b/examples/custom_widget/src/main.rs
@@ -82,8 +82,8 @@ mod circle {
 }
 
 use circle::circle;
-use iced::widget::{column, container, slider, text};
-use iced::{Alignment, Element, Length};
+use iced::widget::{center, column, slider, text};
+use iced::{Alignment, Element};
 
 pub fn main() -> iced::Result {
     iced::run("Custom Widget - Iced", Example::update, Example::view)
@@ -122,12 +122,7 @@ impl Example {
         .max_width(500)
         .align_items(Alignment::Center);
 
-        container(content)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(content).into()
     }
 }
 

diff --git a/examples/download_progress/src/main.rs b/examples/download_progress/src/main.rs
@@ -1,7 +1,7 @@
 mod download;
 
-use iced::widget::{button, column, container, progress_bar, text, Column};
-use iced::{Alignment, Element, Length, Subscription};
+use iced::widget::{button, center, column, progress_bar, text, Column};
+use iced::{Alignment, Element, Subscription};
 
 pub fn main() -> iced::Result {
     iced::program("Download Progress - Iced", Example::update, Example::view)
@@ -67,13 +67,7 @@ impl Example {
                 .spacing(20)
                 .align_items(Alignment::End);
 
-        container(downloads)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .padding(20)
-            .into()
+        center(downloads).padding(20).into()
     }
 }
 

diff --git a/examples/editor/src/main.rs b/examples/editor/src/main.rs
@@ -277,7 +277,7 @@ fn action<'a, Message: Clone + 'a>(
     label: &'a str,
     on_press: Option<Message>,
 ) -> Element<'a, Message> {
-    let action = button(container(content).width(30).center_x());
+    let action = button(container(content).center_x().width(30));
 
     if let Some(on_press) = on_press {
         tooltip(

diff --git a/examples/events/src/main.rs b/examples/events/src/main.rs
@@ -1,6 +1,6 @@
 use iced::alignment;
 use iced::event::{self, Event};
-use iced::widget::{button, checkbox, container, text, Column};
+use iced::widget::{button, center, checkbox, text, Column};
 use iced::window;
 use iced::{Alignment, Command, Element, Length, Subscription};
 
@@ -84,11 +84,6 @@ impl Events {
             .push(toggle)
             .push(exit);
 
-        container(content)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .center_x()
-            .center_y()
-            .into()
+        center(content).into()
     }
 }
diff --git a/examples/exit/src/main.rs b/examples/exit/src/main.rs
@@ -1,6 +1,6 @@
-use iced::widget::{button, column, container};
+use iced::widget::{button, center, column};
 use iced::window;
-use iced::{Alignment, Command, Element, Length};
+use iced::{Alignment, Command, Element};
 
 pub fn main() -> iced::Result {
     iced::program("Exit - Iced", Exit::update, Exit::view).run()
@@ -46,12 +46,6 @@ impl Exit {
         .spacing(10)
         .align_items(Alignment::Center);
 
-        container(content)
-            .width(Length::Fill)
-            .height(Length::Fill)
-            .padding(20)
-            .center_x()
-            .center_y()
-            .into()
+        center(content).padding(20).into()
     }
 }
diff --git a/examples/ferris/src/main.rs b/examples/ferris/src/main.rs
@@ -1,6 +1,6 @@
 use iced::time::Instant;
 use iced::widget::{
-    checkbox, column, container, image, pick_list, row, slider, text,
+    center, checkbox, column, container, image, pick_list, row, slider, text,
 };
 use iced::window;
 use iced::{
@@ -87,28 +87,22 @@ impl Image {
     }
 
     fn view(&self) -> Element<Message> {
-        let i_am_ferris = container(
-            column![
-                "Hello!",
-                Element::from(
-                    image(format!(
-                        "{}/../tour/images/ferris.png",
-                        env!("CARGO_MANIFEST_DIR")
-                    ))
-                    .width(self.width)
-                    .content_fit(self.content_fit)
-                    .rotation(self.rotation)
-                )
-                .explain(Color::WHITE),
-                "I am Ferris!"
-            ]
-            .spacing(20)
-            .align_items(Alignment::Center),
-        )
-        .width(Length::Fill)
-        .height(Length::Fill)
-        .center_x()
-        .center_y();
+        let i_am_ferris = column![
+            "Hello!",
+            Element::from(
+                image(format!(
+                    "{}/../tour/images/ferris.png",
+                    env!("CARGO_MANIFEST_DIR")
+                ))
+                .width(self.width)
+                .content_fit(self.content_fit)
+                .rotation(self.rotation)
+            )
+            .explain(Color::WHITE),
+            "I am Ferris!"
+        ]
+        .spacing(20)
+        .align_items(Alignment::Center);
 
         let sizing = row![
             pick_list(
@@ -126,13 +120,14 @@ impl Image {
             column![
                 slider(100.0..=500.0, self.width, Message::WidthChanged),
                 text(format!("Width: {}px", self.width))
-                    .size(14)
+                    .size(12)
                     .line_height(1.0)
             ]
-            .spacing(5)
+            .spacing(2)
             .align_items(Alignment::Center)
         ]
-        .spacing(10);
+        .spacing(10)
+        .align_items(Alignment::End);
 
         let rotation = row![
             pick_list(
@@ -144,30 +139,34 @@ impl Image {
                 Message::RotationStrategyChanged,
             )
             .width(Length::Fill),
-            row![
-                column![
+            column![
+                row![
                     slider(
                         Degrees::RANGE,
                         self.rotation.degrees(),
                         Message::RotationChanged
                     ),
-                    text(format!(
-                        "Rotation: {:.0}°",
-                        f32::from(self.rotation.degrees())
-                    ))
-                    .size(14)
-                    .line_height(1.0)
+                    checkbox("Spin!", self.spin)
+                        .text_size(12)
+                        .on_toggle(Message::SpinToggled)
+                        .size(12)
                 ]
-                .spacing(5)
+                .spacing(10)
                 .align_items(Alignment::Center),
-                checkbox("Spin!", self.spin).on_toggle(Message::SpinToggled)
+                text(format!(
+                    "Rotation: {:.0}°",
+                    f32::from(self.rotation.degrees())
+                ))
+                .size(12)
+                .line_height(1.0)
             ]
-            .spacing(5)
+            .spacing(2)
             .align_items(Alignment::Center)
         ]
-        .spacing(10);
+        .spacing(10)
+        .align_items(Alignment::End);
 
-        container(column![i_am_ferris, sizing, rotation].spacing(10))
+        container(column![center(i_am_ferris), sizing, rotation].spacing(10))
             .padding(10)
             .into()
     }

diff --git a/examples/geometry/src/main.rs b/examples/geometry/src/main.rs
@@ -153,7 +153,7 @@ mod rainbow {
 }
 
 use iced::widget::{column, container, scrollable};
-use iced::{Element, Length};
+use iced::Element;
 use rainbow::rainbow;
 
 pub fn main() -> iced::Result {
@@ -176,12 +176,7 @@ fn view(_state: &()) -> Element<'_, ()> {
     .spacing(20)
     .max_width(500);
 
-    let scrollable =
-        scrollable(container(content).width(Length::Fill).center_x());
+    let scrollable = scrollable(container(content).center_x());
 
-    container(scrollable)
-        .width(Length::Fill)
-        .height(Length::Fill)
-        .center_y()
-        .into()
+    container(scrollable).center_y().into()
 }