#Fuzzy UI text in Update schedule

25 messages · Page 1 of 1 (latest)

reef perch
#

Hi, I have a UI Text node in my Startup schedule that looks nice and clear, and even with a text update of one of the Startup fields in the Update stage, but when I spawn text nodes in the Update stage, they look terrible, pixelated, fuzzy, almost unreadable. I don' t understand why this is.
Here is my setup fn running on Startup, which looks nice and crisp:

    // UI camera
    commands.spawn(Camera2dBundle::default());
    // Main Title
    commands.spawn((
        // Create a TextBundle that has a Text with a single section.
        TextBundle::from_section(
            // Accepts a `String` or any type that converts into a `String`, such as `&str`
            "ECS DataLayer",
            TextStyle {
                // This font is loaded and will be used instead of the default font.
                font_size: 14.0,
                ..default()
            },
        ) // Set the justification of the Text
        .with_text_justify(JustifyText::Center)
        // Set the style of the TextBundle itself.
        .with_style(Style {
            position_type: PositionType::Absolute,
            top: Val::Px(5.0),
            left: Val::Px(5.0),
            ..default()
        }),
        ColorText,
    ));```
#

and here is my spawning fn running in Update, which is not crisp:

    // Create a parent entity for the list
    commands
        .spawn(NodeBundle {
            style: Style {
                flex_direction: FlexDirection::Column, // Arrange children in a column
                ..default()
            },
            ..default()
        })
        .with_children(|parent| {
            // Add the label as the first child
            spawn_child_text_bundle(parent, "CSV File Paths");
            spawn_child_text_bundle(parent, "Entry 1");
            spawn_child_text_bundle(parent, "Entry 2");
            spawn_child_text_bundle(parent, "Entry 3");
        });
}

fn spawn_child_text_bundle(parent: &mut ChildBuilder, text: &str) {
    parent.spawn(TextBundle {
        text: Text {
            sections: vec![TextSection::new(
                text.to_string(),
                TextStyle {
                    font_size: 14.0,
                    color: Color::WHITE,
                    ..default()
                },
            )],
            ..default()
        },
        ..default()
    });
}```
Any pointers or assistance is greatly appreciated!
plain abyss
#

Spawning it in update means it spawns a new text entity every frame. My guess is that the overlapping text is causing the visual issues you are seeing

zenith yarrow
#

@reef perch you can handle those quite frequent cases, where you need to spawn text not during Startup, but during Update, when entity with some component appears, by using Added<SomeComponent> in the query filter - that way you will react to every new component appearing (which will require spawning some text), but once only (to avoid the issue which IceSentry described above)

reef perch
#

Ah, excellent. Thank you. I figured it was something like that, but am still getting familiar with bevy

plain abyss
reef perch
#

I have clear text, but my approach is limited to spawning layouts and text on Startup for now. I'll be swinging back around to dynamic lists shortly and will give it another go

#

My understanding is that there is some kind of text cache? So by using Added<MyGrowableResourceList> it allows this cache to function as intended, instead of re-rendering text at 60fps.

zenith yarrow
#

Text cache? No no, it's just basics of ECS in bevy, and game loops

If you do something in update that happens every frame, and you were spawning text literally every frame, so on typical monitor 60 times a second 😄

#

Added<> is ECS query syntax which queries by component you pass to it as generic - but additionally queries if it was just added in the frame, adding happens only once so that way you avoid spawning text bundles thousands of times

#

The way to go about managing text is to create your own component which you later add a behaviour (in a system) for, which is spawning bevy text bundle, you can also just simply insert it into same entity

reef perch
#

Ok, I'm making my second attempt, a bit more familiar with bevy now. So If i have dynamic text, it should be a MyComponent {mytext: String}, that I then spawn and its displayed via some other component with some sort of conditional system using Added<MyComponent>?

zenith yarrow
#

@reef perch made a small example for you:

#[derive(Component, Reflect)]
#[reflect(Component)]
struct DynamicText;

fn spawn_example(mut commands: Commands) {
    commands.spawn(DynamicText);
}

fn draw_dynamic_texts(new_texts: Query<Entity, Added<DynamicText>>, mut commands: Commands) {
    for dynamic_text in new_texts.iter() {
        commands.entity(dynamic_text).insert(TextBundle {
            text: Text::from_section("Heyo", TextStyle::default()),
            ..default()
        });
    }
}

fn update_dynamic_texts(mut dynamic_texts: Query<&mut Text, With<DynamicText>>) {
    for mut dynamic_text in dynamic_texts.iter_mut() {
        dynamic_text.sections[0].value = "heyo2!".to_string();
    }
}
#

it looks a bit weird if you spawn it like that, but I just wanted to illustrate how to go about it

reef perch
zenith yarrow
#

ah just from habit, you dont have to reflect it

reef perch
#

I am really enjoying the pinpoint resolution of bevy.

zenith yarrow
#

just later on you have ton of data everywhere, I do reflection on it all then register types, to see values in bevy editor when running application

reef perch
#

Reflection provides the whole entity from querying on a component?

zenith yarrow
#

no no, it has nothing to do with how this example works

#

later on I can open bevy editor and see values there

#

you need to register types for that

#

otherwise

image.png
reef perch
#

bevy EDITOR? I am trying to get a list of my Components, Resources etc. Ok, ill look at that later, look useful. Thanks for the text example, really appreciated - I'm going to try it now