Add a new trait to accept more types in the Val-helper functions

crates/bevy_ui/src/geometry.rs

@@ -282,15 +282,39 @@ impl Val {
     }
 }
 
+/// All the types that should be able to be used in the [`Val`] enum should implement this trait.
+///
+/// Instead of just implementing `Into<Val>` a custom trait is added.
+/// This is done in order to prevent having to define a default unit, which could lead to confusion especially for newcomers.
+pub trait ValNum {
+    /// Called by the [`Val`] helper functions to convert the implementing type to an `f32` that can
+    /// be used by [`Val`].
+    fn val_num_f32(self) -> f32;
+}
+
+macro_rules! impl_to_val_num {
+    ($($impl_type:ty),*$(,)?) => {
+        $(
+            impl ValNum for $impl_type {
+                fn val_num_f32(self) -> f32 {
+                    self as f32
+                }
+            }
+        )*
+    };
+}
+
+impl_to_val_num!(f32, f64, i8, i16, i32, i64, u8, u16, u32, u64, usize, isize);
+
 /// Returns a [`Val::Auto`] where the value is automatically determined
 /// based on the context and other [`Node`](crate::Node) properties.
 pub const fn auto() -> Val {
     Val::Auto
 }
 
 /// Returns a [`Val::Px`] representing a value in logical pixels.
-pub const fn px(value: f32) -> Val {
-    Val::Px(value)
+pub fn px<T: ValNum>(value: T) -> Val {
+    Val::Px(value.val_num_f32())
 }
 
 /// Returns a [`Val::Percent`] representing a percentage of the parent node's length
@@ -306,28 +330,28 @@ pub const fn px(value: f32) -> Val {
 ///   - `height` is relative to the parent's height.
 /// * For `margin`, `padding`, and `border` values: the percentage is relative to the parent's width.
 /// * For positions, `left` and `right` are relative to the parent's width, while `bottom` and `top` are relative to the parent's height.
-pub const fn percent(value: f32) -> Val {
-    Val::Percent(value)
+pub fn percent<T: ValNum>(value: T) -> Val {
+    Val::Percent(value.val_num_f32())
 }
 
 /// Returns a [`Val::Vw`] representing a percentage of the viewport width.
-pub const fn vw(value: f32) -> Val {
-    Val::Vw(value)
+pub fn vw<T: ValNum>(value: T) -> Val {
+    Val::Vw(value.val_num_f32())
 }
 
 /// Returns a [`Val::Vh`] representing a percentage of the viewport height.
-pub const fn vh(value: f32) -> Val {
-    Val::Vh(value)
+pub fn vh<T: ValNum>(value: T) -> Val {
+    Val::Vh(value.val_num_f32())
 }
 
 /// Returns a [`Val::VMin`] representing a percentage of the viewport's smaller dimension.
-pub const fn vmin(value: f32) -> Val {
-    Val::VMin(value)
+pub fn vmin<T: ValNum>(value: T) -> Val {
+    Val::VMin(value.val_num_f32())
 }
 
 /// Returns a [`Val::VMax`] representing a percentage of the viewport's larger dimension.
-pub const fn vmax(value: f32) -> Val {
-    Val::VMax(value)
+pub fn vmax<T: ValNum>(value: T) -> Val {
+    Val::VMax(value.val_num_f32())
 }
 
 /// A type which is commonly used to define margins, paddings and borders.

examples/2d/2d_shapes.rs

@@ -87,8 +87,8 @@ fn setup(
         Text::new("Press space to toggle wireframes"),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/2d/2d_viewport_to_world.rs

@@ -150,8 +150,8 @@ fn setup(
         ),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/2d/bloom_2d.rs

@@ -62,8 +62,8 @@ fn setup(
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/2d/rotation.rs

@@ -61,8 +61,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
         Text::new("Up Arrow: Move Forward\nLeft / Right Arrow: Turn"),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/2d/sprite_animation.rs

@@ -94,8 +94,8 @@ fn setup(
         Text::new("Left Arrow: Animate Left Sprite\nRight Arrow: Animate Right Sprite"),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/2d/wireframe_2d.rs

@@ -93,8 +93,8 @@ fn setup(
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/3d_shapes.rs

@@ -150,8 +150,8 @@ fn setup(
         Text::new("Press space to toggle wireframes"),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/anisotropy.rs

@@ -138,8 +138,8 @@ fn spawn_text(commands: &mut Commands, app_status: &AppStatus) {
         app_status.create_help_text(),
         Node {
             position_type: PositionType::Absolute,
-            bottom: Val::Px(12.0),
-            left: Val::Px(12.0),
+            bottom: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/anti_aliasing.rs

@@ -456,8 +456,8 @@ fn setup(
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/atmospheric_fog.rs

@@ -88,8 +88,8 @@ fn setup_instructions(mut commands: Commands) {
     commands.spawn((Text::new("Press Spacebar to Toggle Atmospheric Fog.\nPress S to Toggle Directional Light Fog Influence."),
         Node {
             position_type: PositionType::Absolute,
-            bottom: Val::Px(12.0),
-            left: Val::Px(12.0),
+            bottom: px(12),
+            left: px(12),
             ..default()
         })
     );

examples/3d/auto_exposure.rs

@@ -117,8 +117,8 @@ fn setup(
             ..default()
         },
         Node {
-            width: Val::Percent(100.0),
-            height: Val::Percent(100.0),
+            width: percent(100),
+            height: percent(100),
             ..default()
         },
     ));
@@ -128,8 +128,8 @@ fn setup(
     commands.spawn((Text::new("Left / Right - Rotate Camera\nC - Toggle Compensation Curve\nM - Toggle Metering Mask\nV - Visualize Metering Mask"),
             text_font.clone(), Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         })
     );
@@ -139,8 +139,8 @@ fn setup(
         text_font,
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            right: Val::Px(12.0),
+            top: px(12),
+            right: px(12),
             ..default()
         },
         ExampleDisplay,

examples/3d/blend_modes.rs

@@ -171,8 +171,8 @@ fn setup(
             text_style.clone(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         })
     );
@@ -182,8 +182,8 @@ fn setup(
         text_style,
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            right: Val::Px(12.0),
+            top: px(12),
+            right: px(12),
             ..default()
         },
         ExampleDisplay,
@@ -327,8 +327,8 @@ fn example_control_system(
             .world_to_viewport(camera_global_transform, world_position)
             .unwrap();
 
-        node.top = Val::Px(viewport_position.y);
-        node.left = Val::Px(viewport_position.x);
+        node.top = px(viewport_position.y);
+        node.left = px(viewport_position.x);
     }
 
     display.0 = format!(

examples/3d/bloom_3d.rs

@@ -87,8 +87,8 @@ fn setup_scene(
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            bottom: Val::Px(12.0),
-            left: Val::Px(12.0),
+            bottom: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/clearcoat.rs

@@ -219,8 +219,8 @@ fn spawn_text(commands: &mut Commands, light_mode: &LightMode) {
         light_mode.create_help_text(),
         Node {
             position_type: PositionType::Absolute,
-            bottom: Val::Px(12.0),
-            left: Val::Px(12.0),
+            bottom: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/clustered_decals.rs

@@ -263,9 +263,9 @@ fn spawn_buttons(commands: &mut Commands) {
         .spawn(Node {
             flex_direction: FlexDirection::Row,
             position_type: PositionType::Absolute,
-            right: Val::Px(10.0),
-            bottom: Val::Px(10.0),
-            column_gap: Val::Px(6.0),
+            right: px(10),
+            bottom: px(10),
+            column_gap: px(6),
             ..default()
         })
         .with_children(|parent| {
@@ -304,8 +304,8 @@ fn spawn_help_text(commands: &mut Commands, app_status: &AppStatus) {
         Text::new(create_help_string(app_status)),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
         HelpText,

examples/3d/color_grading.rs

@@ -141,9 +141,9 @@ fn add_buttons(commands: &mut Commands, font: &Handle<Font>, color_grading: &Col
         .spawn(Node {
             flex_direction: FlexDirection::Column,
             position_type: PositionType::Absolute,
-            row_gap: Val::Px(6.0),
-            left: Val::Px(12.0),
-            bottom: Val::Px(12.0),
+            row_gap: px(6),
+            left: px(12),
+            bottom: px(12),
             ..default()
         })
         .with_children(|parent| {
@@ -172,7 +172,7 @@ fn add_buttons_for_global_controls(
     parent.spawn(Node::default()).with_children(|parent| {
         // Add some placeholder text to fill this column.
         parent.spawn(Node {
-            width: Val::Px(125.0),
+            width: px(125),
             ..default()
         });
 
@@ -210,7 +210,7 @@ fn add_buttons_for_section(
         .with_children(|parent| {
             // Spawn the label ("Highlights", etc.)
             add_text(parent, &section.to_string(), font, Color::WHITE).insert(Node {
-                width: Val::Px(125.0),
+                width: px(125),
                 ..default()
             });
 
@@ -244,12 +244,12 @@ fn add_button_for_value(
         .spawn((
             Button,
             Node {
-                border: UiRect::all(Val::Px(1.0)),
-                width: Val::Px(200.0),
+                border: UiRect::all(px(1)),
+                width: px(200),
                 justify_content: JustifyContent::Center,
                 align_items: AlignItems::Center,
-                padding: UiRect::axes(Val::Px(12.0), Val::Px(6.0)),
-                margin: UiRect::right(Val::Px(12.0)),
+                padding: UiRect::axes(px(12), px(6)),
+                margin: UiRect::right(px(12)),
                 ..default()
             },
             BorderColor::all(Color::WHITE),
@@ -305,8 +305,8 @@ fn add_help_text(
         },
         Node {
             position_type: PositionType::Absolute,
-            left: Val::Px(12.0),
-            top: Val::Px(12.0),
+            left: px(12),
+            top: px(12),
             ..default()
         },
         HelpText,

examples/3d/deferred_rendering.rs

@@ -185,8 +185,8 @@ fn setup(
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/depth_of_field.rs

@@ -93,8 +93,8 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>, app_settings: R
         create_text(&app_settings),
         Node {
             position_type: PositionType::Absolute,
-            bottom: Val::Px(12.0),
-            left: Val::Px(12.0),
+            bottom: px(12),
+            left: px(12),
             ..default()
         },
     ));

examples/3d/fog.rs

@@ -127,8 +127,8 @@ fn setup_instructions(mut commands: Commands) {
         Text::default(),
         Node {
             position_type: PositionType::Absolute,
-            top: Val::Px(12.0),
-            left: Val::Px(12.0),
+            top: px(12),
+            left: px(12),
             ..default()
         },
     ));