Merge pull request #163 from latidoremi/dyn_height

Menu dynamic item height
iced-rs · Aug 4, 2023 · 94237e3 · 94237e3
2 parents 51247f3 + 3046344
commit 94237e3
Show file tree

Hide file tree

Showing 2 changed files with 174 additions and 96 deletions.
diff --git a/examples/menu/src/main.rs b/examples/menu/src/main.rs
@@ -13,7 +13,7 @@ pub fn main() -> iced::Result {
     App::run(iced::Settings {
         default_text_size: 15.0,
         window: iced::window::Settings {
-            size: (800, 500),
+            size: (1000, 500),
             // position: iced::window::Position::Default,
             ..Default::default()
         },
@@ -25,9 +25,14 @@ pub fn main() -> iced::Result {
 enum SizeOption {
     Uniform,
     Static,
+    DynamicHeight,
 }
 impl SizeOption {
-    const ALL: [SizeOption; 2] = [SizeOption::Uniform, SizeOption::Static];
+    const ALL: [SizeOption; 3] = [
+        SizeOption::Uniform,
+        SizeOption::Static,
+        SizeOption::DynamicHeight,
+    ];
 }
 impl std::fmt::Display for SizeOption {
     fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
@@ -37,6 +42,7 @@ impl std::fmt::Display for SizeOption {
             match self {
                 Self::Uniform => "Uniform",
                 Self::Static => "Static",
+                Self::DynamicHeight => "DynamicHeight",
             }
         )
     }
@@ -91,7 +97,7 @@ impl Application for App {
                 flip_v: false,
                 dark_mode: false,
                 text: "Text Input".into(),
-                size_option: SizeOption::Static,
+                size_option: SizeOption::DynamicHeight,
             },
             iced::Command::none(),
         )
@@ -169,7 +175,7 @@ impl Application for App {
             SizeOption::Uniform => {
                 menu_bar!(menu_1(self), menu_2(self), menu_3(self), menu_4(self))
                     .item_width(ItemWidth::Uniform(180))
-                    .item_height(ItemHeight::Uniform(25))
+                    .item_height(ItemHeight::Uniform(27))
             }
             SizeOption::Static => menu_bar!(
                 menu_1(self),
@@ -179,7 +185,16 @@ impl Application for App {
                 menu_5(self),
             )
             .item_width(ItemWidth::Static(180))
-            .item_height(ItemHeight::Static(25)),
+            .item_height(ItemHeight::Static(35)),
+            SizeOption::DynamicHeight => menu_bar!(
+                menu_1(self),
+                menu_2(self),
+                menu_3(self),
+                menu_4(self),
+                menu_6(self),
+            )
+            .item_width(ItemWidth::Static(180))
+            .item_height(ItemHeight::Dynamic(35)),
         }
         .spacing(4.0)
         .bounds_expand(30)
@@ -276,6 +291,18 @@ fn debug_item<'a>(label: &str) -> MenuTree<'a, Message, iced::Renderer> {
     menu_tree!(debug_button(label).width(Length::Fill).height(Length::Fill))
 }
 
+fn debug_item2<'a>(label: &str) -> MenuTree<'a, Message, iced::Renderer> {
+    menu_tree!(debug_button(label)
+        .width(Length::Fill)
+        .height(Length::Shrink))
+}
+
+fn debug_item3<'a>(label: &str, h: f32) -> MenuTree<'a, Message, iced::Renderer> {
+    menu_tree!(debug_button(label)
+        .width(Length::Fill)
+        .height(Length::Fixed(h)))
+}
+
 fn color_item<'a>(color: impl Into<Color>) -> MenuTree<'a, Message, iced::Renderer> {
     let color = color.into();
     menu_tree!(base_button(circle(color), Message::ColorChange(color)))
@@ -304,7 +331,8 @@ fn sub_menu<'a>(
                     .height(Length::Fill)
                     .vertical_alignment(alignment::Vertical::Center),
                 arrow
-            ],
+            ]
+            .align_items(iced::Alignment::Center),
             msg,
         )
         .width(Length::Fill)
@@ -725,3 +753,44 @@ fn menu_5<'a>(app: &App) -> MenuTree<'a, Message, iced::Renderer> {
 
     root
 }
+
+fn menu_6<'a>(app: &App) -> MenuTree<'a, Message, iced::Renderer> {
+    let slider_count = 3;
+    let slider_width = 30;
+    let spacing = 4;
+
+    let [r, g, b, _] = app.theme.palette().primary.into_rgba8();
+
+    let sliders = menu_tree!(row![
+        vertical_slider(0..=255, r, move |x| Message::ColorChange(Color::from_rgb8(
+            x, g, b
+        )))
+        .width(30),
+        vertical_slider(0..=255, g, move |x| Message::ColorChange(Color::from_rgb8(
+            r, x, b
+        )))
+        .width(30),
+        vertical_slider(0..=255, b, move |x| Message::ColorChange(Color::from_rgb8(
+            r, g, x
+        )))
+        .width(30),
+    ]
+    .spacing(4)
+    .height(100));
+
+    let root = menu_tree(
+        debug_button("Dynamic Height"),
+        vec![
+            labeled_separator("Primary"),
+            sliders,
+            debug_item2("AABB"),
+            debug_item3("CCDD", 50.0),
+            debug_item2("EEFF"),
+            debug_item("GGHH").height(100),
+            debug_item2("IIJJ"),
+        ],
+    )
+    .width(slider_width * slider_count + (slider_count - 1) * spacing);
+
+    root
+}