Allow constraining Text in percent of window size

[NiklasEi]

resolves #1490

I based the extended constraint calculation on the previous code. But I find the previous and also the current implementation a bit confusing. It does not behave like I would expect it to. Could somebody explain to me why we take min and max constraints but only look at max if it is given? There doesn't seem to be any logic for the text box to be somewhere in between min and max based on e.g. screen size or other content on the screen.

That said, the corresponding issue should be fixed with this PR. If someone else would like to play around with it, I created a minimal Bevy App for testing based on the issue: https://github.com/NiklasEi/bevy_text_wrap_fix_1490

[tigregalis]

I think it's an oversight / incomplete implementation. I think the intent is that it works like width, min-width, max-width in css.

Also, Percent should be relative to its container, which may not necessarily be the window.

Now you could rename Percent to ViewPercent (similar to vh and vw) and it would be right.

The challenge is that Text can also be not a UI element though. So not all of these concepts would apply.

[NiklasEi]

I think Text is always UI. Text2D is a different story, but also not relevant for the code changes I did.

Good point with window not always being the container! I will look into that :)

[tigregalis]

Ah, sorry, you're right.

With respect to min_size, size and max_size, I believe the correct approach is to independently calculate each of these in terms of actual pixels. Then you take calculated_pixel_size, and clamp it between calculated_pixel_min_size and calculated_pixel_max_size:

/// Defines how min_size, size, and max_size affects the bounds of a text
/// block.
pub fn text_constraint(
    min_size: Val,
    size: Val,
    max_size: Val,
    scale_factor: f64,
    constraint: f32, // parent node's constraint
) -> f32 {
    let calculated_min_size = match min_size {
        Val::Undefined | Val::Auto => 0.0,
        Val::Px(sz) => scale_value(sz, scale_factor),
        Val::Percent(sz) => scale_value((sz / 100.) * constraint, scale_factor),
    };
    let calculated_max_size = match max_size {
        Val::Undefined | Val::Auto => f32::MAX,
        Val::Px(sz) => scale_value(sz, scale_factor),
        Val::Percent(sz) => scale_value((sz / 100.) * constraint, scale_factor),
    };
    let calculated_size = match size {
        Val::Undefined | Val::Auto => f32::MAX,
        Val::Px(sz) => scale_value(sz, scale_factor),
        Val::Percent(sz) => scale_value((sz / 100.) * constraint, scale_factor),
    };
    // min-biased clamp - seems to be how css works: https://jsfiddle.net/hz2ra8sk/
    if calculated_size <= calculated_min_size {
        calculated_min_size
    } else if calculated_size >= calculated_max_size {
        calculated_max_size
    } else {
        calculated_size
    }
}

[alice-i-cecile]

Closing in favor of #5502.