<" /> <" /> <"/>

TextTrimming property of TextBlock placed in TreeViewItem using GridSplitter

781 Views Asked by At

My XAML is very simple:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="5" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="100" />
    </Grid.ColumnDefinitions>
    <TextBlock FontSize="55" HorizontalAlignment="Center" 
          VerticalAlignment="Center" TextWrapping="Wrap">Left side</TextBlock>
    <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Center" />
    <TreeView Grid.Column="2" ScrollViewer.HorizontalScrollBarVisibility="Disabled" >
        <TreeViewItem>
            <TreeViewItem.Header>
                <TextBlock Text="The full string" 
                                    TextTrimming="CharacterEllipsis"/>
            </TreeViewItem.Header>
            <TreeViewItem>
            <TreeViewItem.Header>
                <TextBlock Text="The full string"/>
            </TreeViewItem.Header>
            </TreeViewItem>
        </TreeViewItem>            
    </TreeView>
    <Border BorderBrush="Green" BorderThickness="5" CornerRadius="5" Grid.Column="3" />
</Grid>

What I have is:

enter image description here

and it is not correct for me:

enter image description here

And what behavior I want is:

enter image description here

How can I use TextTrimming property of TextBlock placed in TreeViewItem?

1

There are 1 best solutions below

0
JohnnyQ On BEST ANSWER

You need to modify the style of your TreeViewItem, because the content is not stretched.

See style example and problem explanation at

https://leecampbell.com/2009/01/14/horizontal-stretch-on-treeviewitems/

Just apply the style from the link to your TreeView

<TreeView>
 <TreeView.Resources>
    <!--paste the style from the link here-->
</TreeView.Resources>

Sorry for not posting the style, but i don't get the formatting done.