Layout rounding debug example (#16096)

# Objective

Simple example for debugging layout rounding errors.

<img width="1039" height="752" alt="layout_rounding_debug"
src="https://github.com/user-attachments/assets/12673000-e267-467e-b25b-3f8001c1347c">

Any white lines are gaps in the layout caused by coordinate rounding
errors.
This commit is contained in:
ickshonpe 2024-10-27 20:08:51 +00:00 committed by GitHub
parent 86ee8e4376
commit 3d72f494a2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 65 additions and 0 deletions

View File

@ -3856,3 +3856,12 @@ doc-scrape-examples = true
[package.metadata.example.testbed_3d] [package.metadata.example.testbed_3d]
hidden = true hidden = true
[[example]]
name = "testbed_ui_layout_rounding"
path = "examples/testbed/ui_layout_rounding.rs"
doc-scrape-examples = true
[package.metadata.example.testbed_ui_layout_rounding]
hidden = true

View File

@ -0,0 +1,56 @@
//! Spawns a simple grid layout with nodes laid out covering a white background useful for catching layout rounding errors.
//! Any white lines seen are gaps in the layout are caused by coordinate rounding bugs.
use bevy::{
color::palettes::css::{DARK_BLUE, MAROON},
prelude::*,
ui::UiScale,
winit::WinitSettings,
};
fn main() {
App::new()
.add_plugins(DefaultPlugins)
.insert_resource(WinitSettings::desktop_app())
.insert_resource(UiScale(1.5))
.add_systems(Startup, setup)
.run();
}
fn setup(mut commands: Commands) {
commands.spawn((Camera2d, UiAntiAlias::Off));
commands
.spawn((
Node {
display: Display::Grid,
width: Val::Percent(100.),
height: Val::Percent(100.),
grid_template_rows: vec![RepeatedGridTrack::fr(10, 1.)],
..Default::default()
},
BackgroundColor(Color::WHITE),
))
.with_children(|commands| {
for i in 2..12 {
commands
.spawn(Node {
display: Display::Grid,
grid_template_columns: vec![RepeatedGridTrack::fr(i, 1.)],
..Default::default()
})
.with_children(|commands| {
for _ in 0..i {
commands.spawn((
Node {
border: UiRect::all(Val::Px(5.)),
..Default::default()
},
BackgroundColor(MAROON.into()),
BorderColor(DARK_BLUE.into()),
));
}
});
}
});
}