UI examples clean up (#9479)

# Objective Fix a few issues with some of the examples: * Root UI nodes have an implicit parent with `FlexDirection::Row` and `AlignItems::Stretch` set. Only a width constraint is needed to fill the viewport. Specifying ```height: Val::Percent(100.)``` is unnecessary and can cause confusing overflow behaviour. * The default for position and size constraint properties is `Val::Auto`. Setting `left: Val::Auto`, `max_height: Val::Auto`, etc does nothing. ## Solution Delete those lines. There should be no observable differences in the behaviours of any of the examples. Also changed a padding setting in the `flex_layout` example to use the `axes` helper function.
bevyengine · Aug 23, 2023 · 373f1ee · 373f1ee
1 parent 20c85b5
commit 373f1ee
Show file tree

Hide file tree

Showing 8 changed files with 1 addition and 13 deletions.
diff --git a/examples/games/game_menu.rs b/examples/games/game_menu.rs
@@ -151,7 +151,6 @@ mod game {
                 NodeBundle {
                     style: Style {
                         width: Val::Percent(100.0),
-                        height: Val::Percent(100.0),
                         // center children
                         align_items: AlignItems::Center,
                         justify_content: JustifyContent::Center,

diff --git a/examples/mobile/src/lib.rs b/examples/mobile/src/lib.rs
@@ -110,7 +110,6 @@ fn setup_scene(
                 position_type: PositionType::Absolute,
                 left: Val::Px(50.0),
                 right: Val::Px(50.0),
-                top: Val::Auto,
                 bottom: Val::Px(50.0),
                 ..default()
             },

diff --git a/examples/ui/display_and_visibility.rs b/examples/ui/display_and_visibility.rs
@@ -412,7 +412,6 @@ where
         .spawn((
             ButtonBundle {
                 style: Style {
-                    //height: Val::Px(24.),
                     align_self: AlignSelf::FlexStart,
                     padding: UiRect::axes(Val::Px(5.), Val::Px(1.)),
                     ..Default::default()

diff --git a/examples/ui/flex_layout.rs b/examples/ui/flex_layout.rs
@@ -162,12 +162,7 @@ fn spawn_nested_text_bundle(
         .spawn(NodeBundle {
             style: Style {
                 margin,
-                padding: UiRect {
-                    top: Val::Px(1.),
-                    left: Val::Px(5.),
-                    right: Val::Px(5.),
-                    bottom: Val::Px(1.),
-                },
+                padding: UiRect::axes(Val::Px(5.), Val::Px(1.)),
                 ..Default::default()
             },
             background_color: BackgroundColor(background_color),

diff --git a/examples/ui/grid.rs b/examples/ui/grid.rs
@@ -183,7 +183,6 @@ fn spawn_layout(mut commands: Commands, asset_server: Res<AssetServer>) {
                     width: Val::Percent(60.),
                     height: Val::Px(300.),
                     max_width: Val::Px(600.),
-                    max_height: Val::Auto,
                     ..default()
                 },
                 background_color: BackgroundColor(Color::Rgba {

diff --git a/examples/ui/overflow_debug.rs b/examples/ui/overflow_debug.rs
@@ -82,7 +82,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         .spawn(NodeBundle {
             style: Style {
                 width: Val::Percent(100.),
-                height: Val::Percent(100.),
                 flex_direction: FlexDirection::Column,
                 ..default()
             },

diff --git a/examples/ui/relative_cursor_position.rs b/examples/ui/relative_cursor_position.rs
@@ -19,7 +19,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         .spawn(NodeBundle {
             style: Style {
                 width: Val::Percent(100.),
-                height: Val::Percent(100.),
                 align_items: AlignItems::Center,
                 justify_content: JustifyContent::Center,
                 flex_direction: FlexDirection::Column,

diff --git a/examples/ui/ui.rs b/examples/ui/ui.rs
@@ -29,7 +29,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         .spawn(NodeBundle {
             style: Style {
                 width: Val::Percent(100.0),
-                height: Val::Percent(100.0),
                 justify_content: JustifyContent::SpaceBetween,
                 ..default()
             },