Broken text wrapping in grid column
See original GitHub issue <Grid ColumnDefinitions="*, *">
<TextBlock Grid.Column="1"
VerticalAlignment="Center"
Text="He determined to drop his litigation with the monastry, and relinguish his claims to the wood-cuting and fishery rihgts at once. He was the more ready to do this becuase the rights had becom much less valuable, and he had indeed the vaguest idea where the wood and river in quedtion were."
TextWrapping="Wrap"/>
</Grid>
Issue Analytics
- State:
- Created 5 years ago
- Comments:8 (8 by maintainers)
Top Results From Across the Web
word-wrap not working in a CSS Grid item
I have a paragraph text without line breaks. It is supposed to be wrapped to a new line if the width exceeds the...
Read more >Wrap text and elements in Grid box - HTML-CSS
Hi there, I need help with styling CSS Grid. I have this outcome for this page section: Pay attention to how text is...
Read more >Help with CSS Grid - Text not wrapping inside grid?
I've been able to make the rows/columns responsive to browser width, however, the text inside the grid seems to overlap in on itself...
Read more >Wrapping and breaking text - CSS: Cascading Style Sheets
Wrapping and breaking text. This guide explains the various ways in which overflowing text can be managed in CSS.
Read more >Text Wrapping in ag-Grid Column Headers & Cells
Today I'll show you how to implement one of the most sought-after features with the grid: automatically wrapping text in both column headers ......
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
This appears to be caused by
Grid
caching the measurement of the child control, and applying that cache to subsequent measurements of a different size:https://github.com/AvaloniaUI/Avalonia/blob/65234e8e43cdbff29791caecf224cbb4b05062be/src/Avalonia.Controls/Grid.cs#L317
My window has a size of (1920,1080) and the Grid tells the TextBox it has available space of (960,16) but the text layout has a height of 32 so one line is cut off. Somehow when you use VerticalAlignment=“Center” the FormattedText doesn’t get enough space. When VerticalAlignment=“Stretch” is used everything works fine.
Update:
Okay, it seems that this cache has an old value. https://github.com/AvaloniaUI/Avalonia/blob/master/src/Avalonia.Controls/Grid.cs#L315
When I debugged this I realized that the FormattedText is constructed twice. The first time the available space is infinity and the second time and old value of the cache.
Removing the caching fixes the issue. Every time a window is resized or shown the layout is calculated twice. The first time the grid passes the whole available space without column calculations and the second time with column calculations but with outdated cached desired size. The second layout pass should only be cached not the first one.