bevy/examples/ui/overflow.rs
ickshonpe 6f7d0e5725
split up TextStyle (#15857)
# Objective

Currently text is recomputed unnecessarily on any changes to its color,
which is extremely expensive.

## Solution
Split up `TextStyle` into two separate components `TextFont` and
`TextColor`.

## Testing

I added this system to `many_buttons`:
```rust
fn set_text_colors_changed(mut colors: Query<&mut TextColor>) {
    for mut text_color in colors.iter_mut() {
        text_color.set_changed();
    }
}
```

reports ~4fps on main, ~50fps with this PR.

## Migration Guide
`TextStyle` has been renamed to `TextFont` and its `color` field has
been moved to a separate component named `TextColor` which newtypes
`Color`.
2024-10-13 17:06:22 +00:00

117 lines
4.7 KiB
Rust

//! Simple example demonstrating overflow behavior.
use bevy::{color::palettes::css::*, prelude::*, winit::WinitSettings};
fn main() {
App::new()
.add_plugins(DefaultPlugins)
// Only run the app when there is user input. This will significantly reduce CPU/GPU use.
.insert_resource(WinitSettings::desktop_app())
.add_systems(Startup, setup)
.add_systems(Update, update_outlines)
.run();
}
fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
commands.spawn(Camera2d);
let text_style = TextFont::default();
let image = asset_server.load("branding/icon.png");
commands
.spawn(NodeBundle {
style: Style {
width: Val::Percent(100.),
height: Val::Percent(100.),
align_items: AlignItems::Center,
justify_content: JustifyContent::Center,
..Default::default()
},
background_color: ANTIQUE_WHITE.into(),
..Default::default()
})
.with_children(|parent| {
for overflow in [
Overflow::visible(),
Overflow::clip_x(),
Overflow::clip_y(),
Overflow::clip(),
] {
parent
.spawn(NodeBundle {
style: Style {
flex_direction: FlexDirection::Column,
align_items: AlignItems::Center,
margin: UiRect::horizontal(Val::Px(25.)),
..Default::default()
},
..Default::default()
})
.with_children(|parent| {
let label = format!("{overflow:#?}");
parent
.spawn(NodeBundle {
style: Style {
padding: UiRect::all(Val::Px(10.)),
margin: UiRect::bottom(Val::Px(25.)),
..Default::default()
},
background_color: Color::srgb(0.25, 0.25, 0.25).into(),
..Default::default()
})
.with_children(|parent| {
parent.spawn((Text::new(label), text_style.clone()));
});
parent
.spawn(NodeBundle {
style: Style {
width: Val::Px(100.),
height: Val::Px(100.),
padding: UiRect {
left: Val::Px(25.),
top: Val::Px(25.),
..Default::default()
},
overflow,
..Default::default()
},
background_color: GRAY.into(),
..Default::default()
})
.with_children(|parent| {
parent.spawn((
ImageBundle {
image: UiImage::new(image.clone()),
style: Style {
min_width: Val::Px(100.),
min_height: Val::Px(100.),
..Default::default()
},
..Default::default()
},
Interaction::default(),
Outline {
width: Val::Px(2.),
offset: Val::Px(2.),
color: Color::NONE,
},
));
});
});
}
});
}
fn update_outlines(mut outlines_query: Query<(&mut Outline, Ref<Interaction>)>) {
for (mut outline, interaction) in outlines_query.iter_mut() {
if interaction.is_changed() {
outline.color = match *interaction {
Interaction::Pressed => RED.into(),
Interaction::Hovered => WHITE.into(),
Interaction::None => Color::NONE,
};
}
}
}