Question

I have a 3 column grid for my layout with each of it width set to Width="*". For the middle (2nd) grid, I have another 3 column grid each containing it own textblock, and again the column grids width are set to Width="*".

When the Window is resized, the grids are resized as expected, however the 3rd textblock isn’t getting trimmed if the text goes outside the boundary of the grid. I have textbox set with TextTrimming="WordEllipsis" and TextWrapping="Wrap", and the properties are not being enforced for some reason.

Here is some of the code I have:

Layout grid:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition MinWidth="150" MaxWidth="300" Width="1*" />
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition MinWidth="150" MaxWidth="500" Width="1*" />
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="2*"/>
    </Grid.ColumnDefinitions>
</Grid>

2nd column code:

<Grid Grid.Column="2" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="5" Width="Auto">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>

    <TextBlock Text="{Binding Path=FeedItems.Count}" Foreground="White" FontSize="18" Width="Auto" FontWeight="SemiBold" />
    <TextBlock Text=" items from " Foreground="White" FontSize="18" Width="Auto" Grid.Column="1" />
    <TextBlock Text="{Binding Path=Name}" Foreground="White" FontSize="18" Grid.Column="2" TextTrimming="CharacterEllipsis" HorizontalAlignment="Left" Width="Auto" TextWrapping="NoWrap" ClipToBounds="True" />
</Grid>

Answer 1

In order for this to work, you would need the last column in the second grid to have a * size, otherwise it will tell the TextBlock that it has as much space as it wants, even if it doesn’t. Auto sized columns won’t restrict the content to the bounds of a grid. However, you would probably get better results if you did this with a single TextBlock, and multiple Runs:

<TextBlock FontSize="18" TextTrimming="CharacterEllipsis">
    <Run Text="{Binding Path=FeedItems.Count}" FontWeight="SemiBold" />
    <Run Text=" items from " />
    <Run Text="{Binding Path=Name}" />
</TextBlock>

Note that you can only bind Run.Text as of .NET 4.0. If you’re using an older version of the framework, you’ll have to create your own BindableRun, which is pretty simple as seen here.