//! This example illustrates how to create UI text and update it in a system. //! //! It displays the current FPS in the top left corner, as well as text that changes color //! in the bottom right. For text within a scene, please see the text2d example. use bevy::{ diagnostic::{Diagnostics, FrameTimeDiagnosticsPlugin}, prelude::*, }; fn main() { App::new() .add_plugins(DefaultPlugins) .add_plugin(FrameTimeDiagnosticsPlugin::default()) .add_startup_system(setup) .add_system(text_update_system) .add_system(text_color_system) .run(); } // A unit struct to help identify the FPS UI component, since there may be many Text components #[derive(Component)] struct FpsText; // A unit struct to help identify the color-changing Text component #[derive(Component)] struct ColorText; fn setup(mut commands: Commands, asset_server: Res) { // UI camera commands.spawn_bundle(Camera2dBundle::default()); // Text with one section commands .spawn_bundle(TextBundle { style: Style { align_self: AlignSelf::FlexEnd, position_type: PositionType::Absolute, position: UiRect { bottom: Val::Px(5.0), right: Val::Px(15.0), ..default() }, ..default() }, // Use the `Text::with_section` constructor text: Text::with_section( // Accepts a `String` or any type that converts into a `String`, such as `&str` "hello\nbevy!", TextStyle { font: asset_server.load("fonts/FiraSans-Bold.ttf"), font_size: 100.0, color: Color::WHITE, }, // Note: You can use `Default::default()` in place of the `TextAlignment` TextAlignment { horizontal: HorizontalAlign::Center, ..default() }, ), ..default() }) .insert(ColorText); // Rich text with multiple sections commands .spawn_bundle(TextBundle { style: Style { align_self: AlignSelf::FlexEnd, ..default() }, // Use `Text` directly text: Text { // Construct a `Vec` of `TextSection`s sections: vec![ TextSection { value: "FPS: ".to_string(), style: TextStyle { font: asset_server.load("fonts/FiraSans-Bold.ttf"), font_size: 60.0, color: Color::WHITE, }, }, TextSection { value: "".to_string(), style: TextStyle { font: asset_server.load("fonts/FiraMono-Medium.ttf"), font_size: 60.0, color: Color::GOLD, }, }, ], ..default() }, ..default() }) .insert(FpsText); } fn text_update_system(diagnostics: Res, mut query: Query<&mut Text, With>) { for mut text in &mut query { if let Some(fps) = diagnostics.get(FrameTimeDiagnosticsPlugin::FPS) { if let Some(average) = fps.average() { // Update the value of the second section text.sections[1].value = format!("{:.2}", average); } } } } fn text_color_system(time: Res