Bevy UI Text Agent Skill

Bevy UI text

When to use

Load this when a UI node or a 2D world label shows a string. Layout stays on bevy-ui-layout.

ECS shape

• UI: spawn Text on an entity. Text requires Node, TextFont, TextColor, and TextLayout. The string on Text is the first span.
• Feature: bevy_text ships with DefaultPlugins. The default_font feature embeds a default ASCII font, so a Text with no custom Font handle still draws.
• World text: Text2d requires TextFont, TextColor, TextLayout, TextBounds, Anchor, and Transform. Text2dShadow offsets a second copy of the glyphs.
• Systems: the engine runs update_text2d_layout in PostUpdate after the string or style changes. Game systems write Text, Text2d, TextSpan, TextFont, and TextColor. They do not run a second layout pass.

Text is the HUD string. Node places it. One system owns later edits to that string.

#[derive(Component)]
struct ScoreLabel;

#[derive(Resource)]
struct Score(u32);

fn spawn_score(mut commands: Commands) {
    commands.spawn((
        Text::new("Score 0"),
        TextFont::from_font_size(FontSize::Px(28.0)),
        TextColor(Color::srgb(0.95, 0.95, 0.9)),
        TextLayout::new(Justify::Left, LineBreak::NoWrap),
        ScoreLabel,
        Node {
            position_type: PositionType::Absolute,
            top: Val::Px(16.0),
            left: Val::Px(16.0),
            ..default()
        },
    ));
    commands.insert_resource(Score(0));
}

fn write_score(score: Res<Score>, mut labels: Query<&mut Text, With<ScoreLabel>>) {
    if !score.is_changed() {
        return;
    }
    for mut text in &mut labels {
        text.0 = format!("Score {}", score.0);
    }
}

pub struct ScoreTextPlugin;

impl Plugin for ScoreTextPlugin {
    fn build(&self, app: &mut App) {
        app.add_systems(Startup, spawn_score)
            .add_systems(Update, write_score);
    }
}

Extra spans are child entities with TextSpan. Each child keeps its own TextFont and TextColor. The parent TextLayout lays out the whole block. Underline and Strikethrough are components on the span that should carry that mark.

fn spawn_status_line(mut commands: Commands) {
    let root = commands
        .spawn((
            Text::new("HP "),
            TextFont::from_font_size(FontSize::Px(24.0)),
            TextLayout::justify(Justify::Center),
        ))
        .id();
    commands.spawn((
        TextSpan::new("12"),
        TextFont::from_font_size(FontSize::Px(24.0)).with_font_weight(FontWeight::BOLD),
        TextColor(Color::srgb(0.9, 0.25, 0.2)),
        ChildOf(root),
    ));
    commands.spawn((
        TextSpan::new(" / 20"),
        TextFont::from_font_size(FontSize::Px(24.0)),
        Underline,
        ChildOf(root),
    ));
}

A world nameplate is Text2d plus a transform. Justify only aligns lines inside the block. Anchor places the block on the transform.

use bevy::sprite::{Anchor, Text2dShadow};

fn spawn_nameplate(mut commands: Commands) {
    commands.spawn((
        Text2d::new("Warden"),
        TextFont::from_font_size(FontSize::Px(32.0)),
        TextColor(Color::WHITE),
        TextLayout::justify(Justify::Center),
        Text2dShadow {
            offset: Vec2::new(2.0, -2.0),
            color: Color::BLACK,
        },
        Anchor::BOTTOM_CENTER,
        Transform::from_xyz(0.0, 48.0, 0.0),
    ));
}

A custom face is an AssetServer handle stored on TextFont. UI drop shadows use TextShadow.

fn spawn_title(mut commands: Commands, assets: Res<AssetServer>) {
    let font = assets.load("fonts/Display.ttf");
    commands.spawn((
        Text::new("Inventory"),
        TextFont::from_font_size(FontSize::Px(40.0)).with_font(font),
        TextColor(Color::srgb(0.93, 0.86, 0.62)),
        TextShadow {
            offset: Vec2::new(3.0, 3.0),
            color: Color::linear_rgba(0.0, 0.0, 0.0, 0.75),
        },
    ));
}

[dependencies]
bevy = "0.20"

Which text entity

| Need | Spawn | Do not |

| --- | --- | --- |

| HUD or menu string | Text on a Node, plus TextFont and TextColor | A second layout system after Text changes |

| Nameplate in the 2D world | Text2d, Anchor, and Text2dShadow | Justify as the world position |

| Two styles in one line | Child TextSpan entities with their own font, color, Underline, or Strikethrough | A markup string parsed by the engine |

Scope

• Font and layout types used above: TextFont, FontSize, FontWeight, TextLayout, Justify, LineBreak.
• Emphasis is components (Underline, Strikethrough, TextColor) on Text or TextSpan, not a markup string.

Expert Knowledge Delta

Target: Bevy 0.20+.

Core ECS types: Component, Resource, Query, Commands, Startup, Update, Fixed / FixedMain (bevy::time), .chain(), Plugin, DefaultPlugins, MinimalPlugins. Messages and observers are an ownership slot. See bevy-events-messaging for their APIs. Systems run in parallel unless .chain() orders the ones that conflict.

Who owns state

| Piece | Owner | Who may mutate | Schedule |

| --- | --- | --- | --- |

| Data on one entity | Component | One system via Query | Update or FixedMain |

| One value for the whole app | Resource | One system | Startup to insert, then the schedule that reads it |

| Spawn | Commands | The spawning system | Startup for the initial world; later schedules for runtime spawn |

| Order that must not race | .chain() | The chained systems only | Same schedule |

| Plugin boundary | Plugin | build registers systems and resources | Before the app runs |

Borrow rule: two systems that both mutably query the same component must be ordered (.chain()) or split so only one writes. Unrelated systems stay parallel. That is the ECS page rule, not a guess at a system-set API.

Decision

| If you need | Do this | Do not |

| --- | --- | --- |

| Per-entity data | Component + Query | One script that owns the whole node tree |

| App-wide config or clock | Resource | Copy the value onto every entity |

| Stable simulation step | FixedMain and the Fixed clock | Tie simulation to raw frame Update |

| Startup spawn | Commands in Startup | Spawn from a render system |

| Cross-system notice that is not shared state | Message or observer slot in bevy-events-messaging | A new event type invented in this file |

| An API outside the documented set | Leave it unnamed | A made-up crate or API |

Load references/ecs-ownership.md for the ownership table.

NEVER

• Do not pin /0.20.0/ in docs URLs. WHY: links stay on latest; the 0.20 target is stated once in prose.
• Do not mutably query the same component from two unordered systems. WHY: the schedule runs systems in parallel unless .chain() orders them.
• Do not invent a physics, navigation, networking, or XR crate here. WHY: this skill only names documented Bevy crates and modules.

• Do not store emphasis in a markup string. WHY: Underline and Strikethrough are components on Text or TextSpan.
• Do not let two systems write the same Text or TextSpan. WHY: the string has one owner; a second writer races the format system.
• No invented APIs or unnamed third-party crates as the chosen solver. WHY: Bevy code stays idiomatic ECS and uses only documented Bevy APIs.

Reference

The library pin on bevy-master stays 0.20.

Official Documentation

• Assets - Official asset catalog. No third-party crate was selected.
• Examples - Example tree on the latest branch.
• ECS - Component, systems, Query, Startup, Update, and .chain().
• Plugins - Plugin, DefaultPlugins, MinimalPlugins, and add_plugins.
• UI examples - Text and node samples on the latest branch.

Related Skills

Prerequisites

• bevy-master - Hub and schedules.
• bevy-ecs-composition - Components and systems.
• bevy-ui-layout - The node that holds the text.

Complements

• bevy-dialogue-system - Line strings.
• bevy-ui-theming - Colors around the string.

Downstream / consumers

• None yet.

Master

• bevy-master - Bevy router.