Skip to content

Commit 90b5ed6

Browse files
authored
Adjust some example text to match visual guidelines (#15966)
# Objective Adjust instruction text in some newer examples to match the [example visual guidelines](https://bevyengine.org/learn/contribute/helping-out/creating-examples/#visual-guidelines). ## Solution Move text 12px from edge of screen ## Testing ``` cargo run --example alter_mesh cargo run --example alter_sprite cargo run --example camera_orbit cargo run --example projection_zoom cargo run --example irradiance_volumes cargo run --example log_layers_ecs cargo run --example multi_asset_sync cargo run --example multiple_windows cargo run --example order_independent_transparency ``` ## Additional information This isn't comprehensive, just the most trivial cases. I'll double check my notes and probably follow up with an issue to look into visual guidelines for a few other examples.
1 parent b4e04f9 commit 90b5ed6

8 files changed

+105
-126
lines changed

examples/3d/order_independent_transparency.rs

+10-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,16 @@ fn setup(
5151

5252
// spawn help text
5353
commands
54-
.spawn((Text::default(), RenderLayers::layer(1)))
54+
.spawn((
55+
Text::default(),
56+
Style {
57+
position_type: PositionType::Absolute,
58+
top: Val::Px(12.0),
59+
left: Val::Px(12.0),
60+
..default()
61+
},
62+
RenderLayers::layer(1),
63+
))
5564
.with_children(|p| {
5665
p.spawn(TextSpan::new("Press T to toggle OIT\n"));
5766
p.spawn(TextSpan::new("OIT Enabled"));

examples/asset/alter_mesh.rs

+13-20
Original file line numberDiff line numberDiff line change
@@ -132,26 +132,19 @@ fn setup(
132132
}
133133

134134
fn spawn_text(mut commands: Commands) {
135-
commands
136-
.spawn((
137-
Name::new("Instructions"),
138-
NodeBundle {
139-
style: Style {
140-
align_items: AlignItems::Start,
141-
flex_direction: FlexDirection::Column,
142-
justify_content: JustifyContent::Start,
143-
width: Val::Percent(100.),
144-
..default()
145-
},
146-
..default()
147-
},
148-
))
149-
.with_children(|parent| {
150-
parent.spawn(Text::new("Space: swap meshes by mutating a Handle<Mesh>"));
151-
parent.spawn(Text::new(
152-
"Return: mutate the mesh itself, changing all copies of it",
153-
));
154-
});
135+
commands.spawn((
136+
Name::new("Instructions"),
137+
Text::new(
138+
"Space: swap meshes by mutating a Handle<Mesh>\n\
139+
Return: mutate the mesh itself, changing all copies of it",
140+
),
141+
Style {
142+
position_type: PositionType::Absolute,
143+
top: Val::Px(12.),
144+
left: Val::Px(12.),
145+
..default()
146+
},
147+
));
155148
}
156149

157150
fn alter_handle(

examples/asset/alter_sprite.rs

+13-20
Original file line numberDiff line numberDiff line change
@@ -90,26 +90,19 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
9090
}
9191

9292
fn spawn_text(mut commands: Commands) {
93-
commands
94-
.spawn((
95-
Name::new("Instructions"),
96-
NodeBundle {
97-
style: Style {
98-
align_items: AlignItems::Start,
99-
flex_direction: FlexDirection::Column,
100-
justify_content: JustifyContent::Start,
101-
width: Val::Percent(100.),
102-
..default()
103-
},
104-
..default()
105-
},
106-
))
107-
.with_children(|parent| {
108-
parent.spawn(Text::new("Space: swap the right sprite's image handle"));
109-
parent.spawn(Text::new(
110-
"Return: modify the image Asset of the left sprite, affecting all uses of it",
111-
));
112-
});
93+
commands.spawn((
94+
Name::new("Instructions"),
95+
Text::new(
96+
"Space: swap the right sprite's image handle\n\
97+
Return: modify the image Asset of the left sprite, affecting all uses of it",
98+
),
99+
Style {
100+
position_type: PositionType::Absolute,
101+
top: Val::Px(12.),
102+
left: Val::Px(12.),
103+
..default()
104+
},
105+
));
113106
}
114107

115108
fn alter_handle(

examples/asset/multi_asset_sync.rs

+9-21
Original file line numberDiff line numberDiff line change
@@ -168,29 +168,17 @@ fn setup_assets(mut commands: Commands, asset_server: Res<AssetServer>) {
168168

169169
fn setup_ui(mut commands: Commands) {
170170
// Display the result of async loading.
171-
commands
172-
.spawn(NodeBundle {
173-
style: Style {
174-
width: Val::Percent(100.),
175-
height: Val::Percent(100.),
176-
justify_content: JustifyContent::End,
177171

178-
..default()
179-
},
172+
commands.spawn((
173+
LoadingText,
174+
Text::new("Loading...".to_owned()),
175+
Style {
176+
position_type: PositionType::Absolute,
177+
left: Val::Px(12.0),
178+
top: Val::Px(12.0),
180179
..default()
181-
})
182-
.with_children(|b| {
183-
b.spawn((
184-
Text::new("Loading...".to_owned()),
185-
TextFont {
186-
font_size: 53.0,
187-
..Default::default()
188-
},
189-
TextColor(Color::BLACK),
190-
TextLayout::new_with_justify(JustifyText::Right),
191-
LoadingText,
192-
));
193-
});
180+
},
181+
));
194182
}
195183

196184
fn setup_scene(

examples/camera/camera_orbit.rs

+14-19
Original file line numberDiff line numberDiff line change
@@ -80,25 +80,20 @@ fn setup(
8080
}
8181

8282
fn instructions(mut commands: Commands) {
83-
commands
84-
.spawn((
85-
Name::new("Instructions"),
86-
NodeBundle {
87-
style: Style {
88-
align_items: AlignItems::Start,
89-
flex_direction: FlexDirection::Column,
90-
justify_content: JustifyContent::Start,
91-
width: Val::Percent(100.),
92-
..default()
93-
},
94-
..default()
95-
},
96-
))
97-
.with_children(|parent| {
98-
parent.spawn(Text::new("Mouse up or down: pitch"));
99-
parent.spawn(Text::new("Mouse left or right: yaw"));
100-
parent.spawn(Text::new("Mouse buttons: roll"));
101-
});
83+
commands.spawn((
84+
Name::new("Instructions"),
85+
Text::new(
86+
"Mouse up or down: pitch\n\
87+
Mouse left or right: yaw\n\
88+
Mouse buttons: roll",
89+
),
90+
Style {
91+
position_type: PositionType::Absolute,
92+
top: Val::Px(12.),
93+
left: Val::Px(12.),
94+
..default()
95+
},
96+
));
10297
}
10398

10499
fn orbit(

examples/camera/projection_zoom.rs

+13-20
Original file line numberDiff line numberDiff line change
@@ -89,26 +89,19 @@ fn setup(
8989
}
9090

9191
fn instructions(mut commands: Commands) {
92-
commands
93-
.spawn((
94-
Name::new("Instructions"),
95-
NodeBundle {
96-
style: Style {
97-
align_items: AlignItems::Start,
98-
flex_direction: FlexDirection::Column,
99-
justify_content: JustifyContent::Start,
100-
width: Val::Percent(100.),
101-
..default()
102-
},
103-
..default()
104-
},
105-
))
106-
.with_children(|parent| {
107-
parent.spawn(Text::new("Scroll mouse wheel to zoom in/out"));
108-
parent.spawn(Text::new(
109-
"Space: switch between orthographic and perspective projections",
110-
));
111-
});
92+
commands.spawn((
93+
Name::new("Instructions"),
94+
Text::new(
95+
"Scroll mouse wheel to zoom in/out\n\
96+
Space: switch between orthographic and perspective projections",
97+
),
98+
Style {
99+
position_type: PositionType::Absolute,
100+
top: Val::Px(12.),
101+
left: Val::Px(12.),
102+
..default()
103+
},
104+
));
112105
}
113106

114107
fn switch_projection(

examples/dev_tools/fps_overlay.rs

+14-18
Original file line numberDiff line numberDiff line change
@@ -43,25 +43,21 @@ fn setup(mut commands: Commands) {
4343
commands.spawn(Camera2d);
4444

4545
// Instruction text
46-
commands
47-
.spawn(NodeBundle {
48-
style: Style {
49-
width: Val::Percent(100.0),
50-
height: Val::Percent(100.0),
51-
align_items: AlignItems::Center,
52-
justify_content: JustifyContent::Center,
53-
..default()
54-
},
46+
47+
commands.spawn((
48+
Text::new(concat!(
49+
"Press 1 to toggle the overlay color.\n",
50+
"Press 2 to decrease the overlay size.\n",
51+
"Press 3 to increase the overlay size.\n",
52+
"Press 4 to toggle the overlay visibility."
53+
)),
54+
Style {
55+
position_type: PositionType::Absolute,
56+
bottom: Val::Px(12.),
57+
left: Val::Px(12.),
5558
..default()
56-
})
57-
.with_children(|c| {
58-
c.spawn(Text::new(concat!(
59-
"Press 1 to toggle the overlay color.\n",
60-
"Press 2 to decrease the overlay size.\n",
61-
"Press 3 to increase the overlay size.\n",
62-
"Press 4 to toggle the overlay visibility."
63-
)));
64-
});
59+
},
60+
));
6561
}
6662

6763
fn customize_config(input: Res<ButtonInput<KeyCode>>, mut overlay: ResMut<FpsOverlayConfig>) {

examples/window/multiple_windows.rs

+19-7
Original file line numberDiff line numberDiff line change
@@ -47,11 +47,23 @@ fn setup_scene(mut commands: Commands, asset_server: Res<AssetServer>) {
4747
))
4848
.id();
4949

50-
// Since we are using multiple cameras, we need to specify which camera UI should be rendered to
51-
commands
52-
.spawn((NodeBundle::default(), TargetCamera(first_window_camera)))
53-
.with_child(Text::new("First window"));
54-
commands
55-
.spawn((NodeBundle::default(), TargetCamera(second_window_camera)))
56-
.with_child(Text::new("Second window"));
50+
let style = Style {
51+
position_type: PositionType::Absolute,
52+
top: Val::Px(12.0),
53+
left: Val::Px(12.0),
54+
..default()
55+
};
56+
57+
commands.spawn((
58+
Text::new("First window"),
59+
style.clone(),
60+
// Since we are using multiple cameras, we need to specify which camera UI should be rendered to
61+
TargetCamera(first_window_camera),
62+
));
63+
64+
commands.spawn((
65+
Text::new("Second window"),
66+
style,
67+
TargetCamera(second_window_camera),
68+
));
5769
}

0 commit comments

Comments
 (0)