amwx / FluentAvalonia

Control library focused on fluent design and bringing more WinUI controls into Avalonia
MIT License
1.05k stars 97 forks source link

Button area overflows the window in a wide TaskDialog #555

Closed PremekTill closed 3 months ago

PremekTill commented 7 months ago

Describe the bug When using a TaskDialog with a wide SubHeader which auto-wraps after one or more spaces, the button area background overflows the edges of the dialog.

Screenshots

Right edge of the button area overflows (light mode).

Right edge of the button area overflows (dark mode).

Works correctly for narrow content.

Desktop/Platform (please complete the following information):

Additional context To reproduce:

Interestingly, this string is long enough to wrap around, but does NOT lead to the same problem as the first one...
```C#
private const string _firmwareWarning = "01234567 890123456 789012 3456789012 345678 9012345678 901234567 890123456 78901234567 890123456789012 3456789 01234 56789012 3456789";

...but this one once again does; the overflow width here is smaller than in the very first example.

Upon further examination, it seems that the TaskDialog area does not count whitespace on the end of an autowrapped line when determining its width, while the Button area does. For testing, you can try the following string variants:

private const string _slightOverflow  = "01234567890123456789012345678901jeklqrfjdsklvjefkljfkljfwlkefjldnv,mndv,ddwewrt4 5gregkl36789";
private const string _massiveOverflow = "01234567890123456789012345678901jeklqrfjdsklvjefkljfkljfwlkefjldnv,mndv,ddwewrt4      5gregkl36789";
private const string _noOverflow      = "01234567890123456789012345678901jeklqrfjdsklvjefkljfkljfwlkefjldnv,mndv,ddwewrt 45gregkl36789";
private const string _noOverflow      = "01234567890123456789012345678901jeklqrfjdsklvjefkljfkljfwlkefjldnv,mndv,ddwewrt 45 gregkl36789";
private const string _noOverflow      = "01234567890123456789012345678901jeklqrfjdsklvjefkljfkljfwlkefjldnv,mndv,ddwewrt4,5gregkl3456789";
private const string _noOverflow      = "01234567890123456789012345678901234567890123456789    \n012345678901234567890123456789";

The text tries to break between the "4" and the "5" near the end of the string. If there is no space between them, there is no issue (any other character can be inserted between them without problems). If there is a space before or after the "45", the text still breaks between them and there is no issue. However, as soon as you add a space between those two, it breaks on the space and buttons start to overflow - and as you add more spaces between the two numbers, the overflow gets bigger and bigger. Interestingly, if the text gets wrapped manually by '\n' (as in the very last example), there is also no issue, even when spaces are added on either side of the linebreak - only when wrapped automatically by Avalonia. I was not able to reproduce the issue with tabs, only with spaces - either the issue is with spaces in particular, or I wasn't able to get the exact length to trigger the issue with tabs.

amwx commented 6 months ago

This feels like an issue with the text rendering system adding extra space where it shouldn't. Are you able to recreate this outside of a TaskDialog? It might be better to get a minimal sample (especially if you can do it without TaskDialog and just core Avalonia stuff) and open an issue upstream.