text_system split

[ickshonpe]

Objective

text_system runs before the UI layout is calculated and the size of the text node is determined, so it cannot correctly shape the text to fit the layout, and has no way of determining if the text needs to be wrapped.

The function text_constraint attempts to determine the size of the node from the local size constraints in the Style component. It can't be made to work, you have to compute the whole layout to get the correct size. A simple example of where this fails completely is a text node set to stretch to fill the empty space adjacent to a node with size constraints set to Val::Percent(50.). The text node will take up half the space, even though its size constraints are Val::Auto

Also because the text_system queries for changes to the Style component, when a style value is changed that doesn't affect the node's geometry the text is recomputed unnecessarily.

Querying on changes to Node is not much better. The UI layout is changed to fit the CalculatedSize of the text, so the size of the node is changed and so the text and UI layout get recalculated multiple times from a single change to a Text.

Also, the MeasureFunc doesn't work at all, it doesn't have enough information to fit the text correctly and makes no attempt.

Fixes #7663, #6717, #5834, #1490,

Solution

Split the text_system into two functions:

• measure_text_system which calculates the size constraints for the text node and runs before UiSystem::Flex
• text_system which runs after UiSystem::Flex and generates the actual text.
• Fix the MeasureFunc calculations.

---

Text wrapping in main:

With this PR:

Changelog

• Removed the previous fields from CalculatedSize. CalculatedSize now contains a boxed Measure.
• Added measurement module to bevy_ui.
• Added the method create_text_measure to TextPipeline.
• Added a new system measure_text_system that runs before UiSystem::Flex that creates a MeasureFunc for the text.
• Rescheduled text_system to run after UiSystem::Flex.
• Added a trait Measure. A Measure is used to compute the size of a UI node when the size of that node is based on its content.
• Added ImageMeasure and TextMeasure which implement Measure.
• Added a new component UiImageSize which is used by update_image_calculated_size_system to track image size changes.
• Added a UiImageSize component to ImageBundle.

Migration Guide

ImageBundle has a new component UiImageSize which contains the size of the image bundle's texture and is updated automatically by update_image_calculated_size_system

[alice-i-cecile]

CC @TimJentzsch @nicoburns for review.

[nicoburns]

I think the text node's dimensions need to computed inside the measure function, because the measure function needs to be able to answer the question "Given that your width is X, what should your height be?". That can't be precomputed.

The way I'd imagine this working is something like:

• Glyph shaping and determining potential wrap points (e.g. via word segmentation) happens in a separate system prior to layout computation. This should be cached/memoized such that it is only recomputed at most once per update to the text.
• One of the outputs of the above process should be something like a Vec<f32> where each item in the Vec represents the length of a word (or perhaps glyph depending on the wrapping mode).
• This Vec<f32> should be captured by the measure func
• The measure func then uses it to compute the correct size given the input constraints every time it's called by packing words into lines (similar to the measure function used in Taffy's generated tests). This could be further cached (esp. the min-content and max-content size) but I would expect performance to be acceptable even if it's not.

[ickshonpe]

I think the text node's dimensions need to computed inside the measure function, because the measure function needs to be able to answer the question "Given that your width is X, what should your height be?". That can't be precomputed.

The way I'd imagine this working is something like:

• Glyph shaping and determining potential wrap points (e.g. via word segmentation) happens in a separate system prior to layout computation. This should be cached/memoized such that it is only recomputed at most once per update to the text.
• One of the outputs of the above process should be something like a Vec<f32> where each item in the Vec represents the length of a word (or perhaps glyph depending on the wrapping mode).
• This Vec<f32> should be captured by the measure func
• The measure func then uses it to compute the correct size given the input constraints every time it's called by packing words into lines (similar to the measure function used in Taffy's generated tests). This could be further cached (esp. the min-content and max-content size) but I would expect performance to be acceptable even if it's not.

Oh no. I was trying to do it that way, precalculate the glyph geometry, and then do the layout calculations in the measurefunc except (for no reason at all) I believed I'd still need access to the TextPipeline and Font data from inside the measurefunc 😅. Instead, I've got this terrible hack where I compute the layout initially with the min_content height, generate the text to fit the returned width and then recompute the layout again with the height of the generated text.

That simplifies things enormously, should be able to clean up everything now.

[Weibye]

1. This is excellent effort!
2. I do agree with Nicoburns on the implementation design.