WPF TreeView with right alignment values

Question

I have a problem with my wpf treeview. It\'s code goes like this:

Answer 1

class StretchedTreeView : TreeView {
    protected override void OnItemContainerStyleChanged(Style oldItemContainerStyle, Style newItemContainerStyle) {
        base.OnItemContainerStyleChanged(oldItemContainerStyle, newItemContainerStyle);
        newItemContainerStyle.Setters
            .Add(new EventSetter(LoadedEvent, new RoutedEventHandler(TreeViewItem_Loaded)));
    }
    void TreeViewItem_Loaded(object sender, RoutedEventArgs e) {
        TreeViewItem item = sender as TreeViewItem;
        if (item == null) {
            return;
        }
        ContentPresenter cp = FindVisualChild<ContentPresenter>(item);
        cp.HorizontalAlignment = HorizontalAlignment.Stretch;
        Border border = FindVisualChild<Border>(item, "Bd");
        border.SetValue(Grid.ColumnSpanProperty, 2);
    }
    static T FindVisualChild<T>(DependencyObject obj, string name = null) where T : DependencyObject {
        for (int i = 0 ; i < VisualTreeHelper.GetChildrenCount(obj) ; i++) {
            DependencyObject child = VisualTreeHelper.GetChild(obj, i);
            if (child != null && child is T
                && (name == null || !(child is FrameworkElement) || name == ((FrameworkElement) child).Name)) {
                return (T) child;
            }
            else {
                T childOfChild = FindVisualChild<T>(child, name);
                if (childOfChild != null) {
                    return childOfChild;
                }
            }
        }
        return null;
    }
}

Answer 2

If I understand your question correctly you want to Stretch the TreeViewItems and align Value to the right. To get the TreeViewItems to Stretch Horizontaly you'll need to edit the Template for TreeViewItem. The problem is explained here: http://leecampbell.blogspot.com/2009/01/horizontal-stretch-on-treeviewitems.html

Here is an edited version of the TreeViewItem which does this. Note that you'll have to add a reference to PresentationFramework.Aero for this to work

Sample

<TreeView ItemsSource="{Binding Path=Items}"
            Grid.RowSpan="2"
            Grid.ColumnSpan="2"
            ItemContainerStyle="{StaticResource StretchTreeViewItemStyle}">
    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type m:MyTreeItem}" ItemsSource="{Binding Items}">
            <DockPanel LastChildFill="True">
                <TextBlock Text="{Binding Path=Value}" DockPanel.Dock="Right"/>
                <TextBlock Text="{Binding Path=Display}" DockPanel.Dock="Left"/>
            </DockPanel>
        </HierarchicalDataTemplate>
    </TreeView.Resources>
</TreeView>

StretchTreeViewItemStyle

<Style x:Key="TreeViewItemFocusVisual">
    <Setter Property="Control.Template">
        <Setter.Value>
            <ControlTemplate>
                <Rectangle/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<PathGeometry x:Key="TreeArrow" Figures="M0,0 L0,6 L6,0 z"/>
<Style x:Key="ExpandCollapseToggleStyle" TargetType="{x:Type ToggleButton}">
    <Setter Property="Focusable" Value="False"/>
    <Setter Property="Width" Value="16"/>
    <Setter Property="Height" Value="16"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Border Background="Transparent" Height="16" Padding="5,5,5,5" Width="16">
                    <Path x:Name="ExpandPath" Data="{StaticResource TreeArrow}" Fill="Transparent" Stroke="#FF989898">
                        <Path.RenderTransform>
                            <RotateTransform Angle="135" CenterY="3" CenterX="3"/>
                        </Path.RenderTransform>
                    </Path>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF1BBBFA"/>
                        <Setter Property="Fill" TargetName="ExpandPath" Value="Transparent"/>
                    </Trigger>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="RenderTransform" TargetName="ExpandPath">
                            <Setter.Value>
                                <RotateTransform Angle="180" CenterY="3" CenterX="3"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Fill" TargetName="ExpandPath" Value="#FF595959"/>
                        <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF262626"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<Style x:Key="StretchTreeViewItemStyle"
    TargetType="{x:Type TreeViewItem}"
    xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
    <Setter Property="Padding" Value="1,0,0,0"/>
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeViewItem}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition MinWidth="19" Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <ToggleButton x:Name="Expander" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ExpandCollapseToggleStyle}"/>
                    <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="1" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                        <ContentPresenter x:Name="PART_Header" ContentSource="Header" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                    </Border>
                    <ItemsPresenter x:Name="ItemsHost" Grid.Column="1" Grid.Row="1"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsExpanded" Value="false">
                        <Setter Property="Visibility" TargetName="ItemsHost" Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="HasItems" Value="false">
                        <Setter Property="Visibility" TargetName="Expander" Value="Hidden"/>
                    </Trigger>
                    <Trigger Property="IsSelected" Value="true">
                        <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                    </Trigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsSelected" Value="true"/>
                            <Condition Property="IsSelectionActive" Value="false"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
                    </MultiTrigger>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="VirtualizingStackPanel.IsVirtualizing" Value="true">
            <Setter Property="ItemsPanel">
                <Setter.Value>
                    <ItemsPanelTemplate>
                        <VirtualizingStackPanel/>
                    </ItemsPanelTemplate>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>