Consider something as follows:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="WrapTextBlock" Grid.Column="0" Text="123 456 789 0123 4456 123 123 123 123 1 23 123 " TextWrapping="Wrap" />
<TextBlock x:Name="NotWrapTextBlock" Grid.Column="1" Text="GGG" />
</Grid>
This XAML will allow WrapTextBlock
text to be wrap, doing this, WrapTextBlock
will take all the space and push NotWrapTextBlock
to the right.
But what I want to do is to have WrapTextBlock
take as less space as possible, pushing NotWrapTextBlock
right after WrapTextBlock
and fill the right side with empty space.
Which means the following:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="WrapTextBlock" Grid.Column="0" Text="123 456 789 0123 4456 123 123 123 123 1 23 123 " TextWrapping="Wrap" />
<TextBlock x:Name="NotWrapTextBlock" Grid.Column="1" Text="GGG" />
</Grid>
But the thing here is, now the text in WrapTextBlock
wouldn't wrap anymore.
I mean something like follows:
When text is too long it requires to warp:
When text is short enough that doesn't requires to warp:
The reason is by defining your ColumnDefinition
as Auto or * you have nothing to limit the size available for your TextBlock
to consume. So it would be expected behavior for the Text to not Wrap. So you'll have to define a Width
or MaxWidth
on either the ColumnDefinition
or the TextBlock
directly. So for instance;
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" MaxWidth="50"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="WrapTextBlock" Text="123 456 789 0123 4456 123 123 123 123 1 23 123 " TextWrapping="Wrap" />
<TextBlock x:Name="NotWrapTextBlock" Grid.Column="1" Text="GGG" />
</Grid>
Will give you your wrap, if you want to say instead only allow it to take for example say, 7% of the space the grid has to use, change the Width
to something like;
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.07*"/>
<ColumnDefinition Width="0.93*"/>
</Grid.ColumnDefinitions>
So the first column will take up 7% of the space available, and the right column will consume the rest. Hope this helps.
Edit Addition:
What you're showing pretty much aligns with your first snippet wherein the first column should push, the second one should only allow enough space for its content to show;
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock x:Name="WrapTextBlock" Grid.Column="0" Text="123 456 789 0123 4456 123 123 123 123 1 23 123 " TextWrapping="Wrap" />
<TextBlock x:Name="NotWrapTextBlock" Grid.Column="1" Text="GGG" />
</Grid>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With