Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Merged by Bors] - Fix the Size helper functions using the wrong default value and improve the UI examples #7626

Closed
wants to merge 4 commits into from
Closed

[Merged by Bors] - Fix the Size helper functions using the wrong default value and improve the UI examples #7626

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
beb12bc
changes:
ickshonpe Feb 11, 2023
a18f362
add assertions to tests checking that the Size and UiRect defaults ar…
ickshonpe Feb 11, 2023
2eaf695
cargo fmt --all
ickshonpe Feb 11, 2023
fa76b63
fixed test
ickshonpe Feb 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 68 additions & 3 deletions crates/bevy_ui/src/geometry.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -339,7 +339,7 @@ pub struct Size {
}

impl Size {
pub const DEFAULT: Self = Self::all(Val::Auto);
pub const DEFAULT: Self = Self::AUTO;

/// Creates a new [`Size`] from a width and a height.
///
Expand Down Expand Up @@ -369,14 +369,14 @@ impl Size {
pub const fn width(width: Val) -> Self {
Self {
width,
height: Val::DEFAULT,
height: Val::Auto,
}
}

/// Creates a new [`Size`] where `height` takes the given value.
pub const fn height(height: Val) -> Self {
Self {
width: Val::DEFAULT,
width: Val::Auto,
height,
}
}
Expand Down Expand Up @@ -443,6 +443,20 @@ impl DivAssign<f32> for Size {
mod tests {
use super::*;

#[test]
fn uirect_default_equals_const_default() {
assert_eq!(
UiRect::default(),
UiRect {
left: Val::Px(0.),
right: Val::Px(0.),
top: Val::Px(0.),
bottom: Val::Px(0.)
}
);
assert_eq!(UiRect::default(), UiRect::DEFAULT);
}

#[test]
fn test_size_from() {
let size: Size = (Val::Px(20.), Val::Px(30.)).into();
Expand Down Expand Up @@ -476,4 +490,55 @@ mod tests {
size /= 2.;
assert_eq!(size, Size::new(Val::Px(10.), Val::Px(10.)));
}

#[test]
fn test_size_all() {
let length = Val::Px(10.);

assert_eq!(
Size::all(length),
Size {
width: length,
height: length
}
);
}

#[test]
fn test_size_width() {
let width = Val::Px(10.);

assert_eq!(
Size::width(width),
Size {
width,
..Default::default()
}
);
}

#[test]
fn test_size_height() {
let height = Val::Px(7.);

assert_eq!(
Size::height(height),
Size {
height,
..Default::default()
}
);
}
Comment on lines +507 to +531
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems to me that it might be better if these tested that you get Auto rather than ..Default::default(). If the default changed this test wouldn't catch the issue.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The purpose of these two tests is to ensure that the helper functions return the same result as setting the field directly and leaving the rest of the struct as default (whatever default it is) as a user would naturally assume.

I'll put in a separate assertion to ensure the default is Auto.


#[test]
fn size_default_equals_const_default() {
assert_eq!(
Size::default(),
Size {
width: Val::Auto,
height: Val::Auto
}
);
assert_eq!(Size::default(), Size::DEFAULT);
}
}
2 changes: 1 addition & 1 deletion examples/ui/button.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.0)),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
..default()
Expand Down
6 changes: 3 additions & 3 deletions examples/ui/relative_cursor_position.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.)),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
flex_direction: FlexDirection::Column,
Expand All @@ -30,8 +30,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
parent
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(250.0), Val::Px(250.0)),
margin: UiRect::new(Val::Px(0.), Val::Px(0.), Val::Px(0.), Val::Px(15.)),
size: Size::all(Val::Px(250.0)),
margin: UiRect::bottom(Val::Px(15.)),
..default()
},
background_color: Color::rgb(235., 35., 12.).into(),
Expand Down
16 changes: 2 additions & 14 deletions examples/ui/transparency_ui.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(50.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.0)),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
justify_content: JustifyContent::SpaceAround,
..default()
},
..default()
Expand Down Expand Up @@ -49,19 +49,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
},
));
});
});

commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(50.0), Val::Percent(100.0)),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
..default()
},
..default()
})
.with_children(|parent| {
// Button with a different color,
// to demonstrate the text looks different due to its transparency.
parent
Expand Down
39 changes: 16 additions & 23 deletions examples/ui/ui.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.0)),
justify_content: JustifyContent::SpaceBetween,
..default()
},
Expand All @@ -35,7 +35,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
parent
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(200.0), Val::Percent(100.0)),
size: Size::width(Val::Px(200.0)),
border: UiRect::all(Val::Px(2.0)),
..default()
},
Expand All @@ -47,7 +47,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
parent
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.0)),
..default()
},
background_color: Color::rgb(0.15, 0.15, 0.15).into(),
Expand Down Expand Up @@ -77,7 +77,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
style: Style {
flex_direction: FlexDirection::Column,
justify_content: JustifyContent::Center,
size: Size::new(Val::Px(200.0), Val::Percent(100.0)),
align_items: AlignItems::Center,
size: Size::width(Val::Px(200.0)),
..default()
},
background_color: Color::rgb(0.15, 0.15, 0.15).into(),
Expand All @@ -95,12 +96,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
},
)
.with_style(Style {
size: Size::new(Val::Undefined, Val::Px(25.)),
margin: UiRect {
left: Val::Auto,
right: Val::Auto,
..default()
},
Comment on lines -99 to -103
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Auto margins are not the default (or should not be). For margins, "auto" means "take up available space". The default margin is zero.

size: Size::height(Val::Px(25.)),
..default()
}),
);
Expand All @@ -109,8 +105,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
.spawn(NodeBundle {
style: Style {
flex_direction: FlexDirection::Column,
align_self: AlignSelf::Center,
size: Size::new(Val::Percent(100.0), Val::Percent(50.0)),
align_self: AlignSelf::Stretch,
size: Size::height(Val::Percent(50.0)),
overflow: Overflow::Hidden,
..default()
},
Expand All @@ -126,6 +122,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
flex_direction: FlexDirection::Column,
flex_grow: 1.0,
max_size: Size::UNDEFINED,
align_items: AlignItems::Center,
..default()
},
..default()
Expand All @@ -148,11 +145,6 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
.with_style(Style {
flex_shrink: 0.,
size: Size::new(Val::Undefined, Val::Px(20.)),
margin: UiRect {
left: Val::Auto,
right: Val::Auto,
..default()
},
Comment on lines -151 to -155
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Auto margins are not the default (or should not be). For margins, "auto" means "take up available space". The default margin is zero.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh I couldn't work out what you meant here for a moment.
The default for margins is Px(0.) as you'd expect.
In both cases, if you look above you can see that I replaced the auto margins with an AlignItems::Center on the parent.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, gotcha.

Copy link
Contributor Author

@ickshonpe ickshonpe Feb 11, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No wait the default is still Val::Undefined, that fix is in the remove Val::Undefined PR and hasn't been merged yet. It's getting hard to keep track, really do need these tests.

..default()
}),
);
Expand Down Expand Up @@ -211,7 +203,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
.with_children(|parent| {
parent.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(100.0), Val::Px(100.0)),
// Take the size of the parent node.
size: Size::all(Val::Percent(100.)),
position_type: PositionType::Absolute,
position: UiRect {
left: Val::Px(20.0),
Expand All @@ -225,7 +218,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
});
parent.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(100.0), Val::Px(100.0)),
size: Size::all(Val::Percent(100.)),
position_type: PositionType::Absolute,
position: UiRect {
left: Val::Px(40.0),
Expand All @@ -239,7 +232,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
});
parent.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(100.0), Val::Px(100.0)),
size: Size::all(Val::Percent(100.)),
position_type: PositionType::Absolute,
position: UiRect {
left: Val::Px(60.0),
Expand All @@ -254,7 +247,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
// alpha test
parent.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Px(100.0), Val::Px(100.0)),
size: Size::all(Val::Percent(100.)),
position_type: PositionType::Absolute,
position: UiRect {
left: Val::Px(80.0),
Expand All @@ -272,7 +265,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
parent
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.)),
position_type: PositionType::Absolute,
justify_content: JustifyContent::Center,
align_items: AlignItems::FlexStart,
Expand All @@ -284,7 +277,7 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
// bevy logo (image)
parent.spawn(ImageBundle {
style: Style {
size: Size::new(Val::Px(500.0), Val::Auto),
size: Size::width(Val::Px(500.0)),
..default()
},
image: asset_server.load("branding/bevy_logo_dark_big.png").into(),
Expand Down
2 changes: 1 addition & 1 deletion examples/ui/z_index.rs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ fn setup(mut commands: Commands) {
commands
.spawn(NodeBundle {
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
size: Size::width(Val::Percent(100.0)),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
..default()
Expand Down