Repository navigation
Text wrapping with Val::Percent #4009
Description
Discussed in #4008
Originally posted by vringar February 21, 2022
Hey,
I'm trying to build a UI that doesn't use Val::px anywhere to ensure that the UI will scale seamlessly for smaller displays, however I'm running into an issue, when trying to get text wrapping to work.
This is the almost minimal code example I could come up with to show the issue:
use bevy::prelude::*;
fn main() {
App::new()
.insert_resource(ClearColor(Color::rgb(0.4, 0.4, 0.4)))
.insert_resource(WindowDescriptor {
title: "TextDemo".to_string(),
vsync: true,
..Default::default()
})
.insert_resource(Msaa { samples: 4 })
.add_plugins(DefaultPlugins)
.add_startup_system(setup)
.run();
}
fn setup(mut commands: Commands, asset_server: Res<AssetServer>){
commands.spawn_bundle(UiCameraBundle::default());
commands
.spawn_bundle(NodeBundle {
// Root Panel, covers the entire screen
style: Style {
size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
justify_content: JustifyContent::SpaceBetween,
..Default::default()
},
color: Color::NONE.into(),
..Default::default()
})
.with_children(|parent| {
spawn_left_panel(parent, &asset_server);
});
}
fn spawn_left_panel(parent: &mut ChildBuilder, asset_server: &Res<AssetServer>) {
parent
.spawn_bundle(NodeBundle {
style: Style {
flex_direction: FlexDirection::ColumnReverse,
size: Size::new(Val::Percent(20.0), Val::Percent(100.0)),
..Default::default()
},
color: Color::rgb(0.10, 0.10, 0.10).into(),
..Default::default()
})
.with_children(|parent| {
parent
.spawn_bundle(TextBundle {
text: Text::with_section(
"This is a super long text, that I would hope would get wrapped. Unfortunately it just breaks out of the box and keeps going",
TextStyle {
font: asset_server.load("FiraSans-Bold.ttf"),
font_size: 20.0,
color: Color::rgb(1.0, 1.0, 1.0),
},
Default::default(),
),
style: Style {
position: Rect {
top: Val::Percent(1.0),
left: Val::Percent(2.0),
..Default::default()
},
max_size: Size::new(Val::Percent(100.0), Val::Undefined),
..Default::default()
},
..Default::default()
});
});
}This results in the following display:
I would have assumed that max_size: Size::new(Val::Percent(100.0), Val::Undefined) would mean that the box can't get bigger than its parent. But that is not how it works. Is the error in my mental model, my code or bevy?
Activity
alice-i-cecile commentedon Jul 29, 2022
Closing as a duplicate of #1490.