Tree lines in WPF TreeView

18 Nov 20183 minutes to read

The WPF TreeView control allows you to show tree lines for its nodes by setting the ShowLines property to true. The default value of the ShowLines property is false.

<treeview:SfTreeView
    Name="sfTreeView"    
    ShowLines="True"
    ChildPropertyName="Childs"
    ItemTemplate="{StaticResource SfTreeView_ItemTemplate}"
    ItemsSource="{Binding Nodes1}" />
sfTreeView.ShowLines = true;

WPF TreeView TreeLines

Enable tree line for root nodes

The control also supports showing tree lines for root nodes by setting the ShowRootLines property to true. The default value of the ShowRootLines property is false.

<treeview:SfTreeView
    Name="sfTreeView"    
    ShowLines="True"
    ShowRootLines="True"
    ChildPropertyName="Childs"
    ItemTemplate="{StaticResource SfTreeView_ItemTemplate}"
    ItemsSource="{Binding Nodes1}" />
sfTreeView.ShowLines = true;
sfTreeView.ShowRootLines = true;

WPF TreeView TreeLine for Root Nodes

Customizing the tree lines

Customizing the line color

You can change the color of tree lines by using the LineStroke property. The default value of the LineStroke property is System.Windows.Media.Colors.LightSlateGray.

<treeview:SfTreeView
    Name="sfTreeView"    
    ShowLines="True"
    ShowRootLines="True"
    LineStroke="DeepSkyBlue"
    ChildPropertyName="Childs"
    ItemTemplate="{StaticResource SfTreeView_ItemTemplate}"
    ItemsSource="{Binding Nodes1}" />
sfTreeView.ShowLines = true;
sfTreeView.ShowRootLines = true;
sfTreeView.LineStroke = new SolidColorBrush(Colors.DeepSkyBlue);

WPF TreeView Custom TreeLines

Customizing the line thickness

You can change the thickness of tree lines by using the LineStrokeThickness property. The default value of the LineStrokeThickness property is 1.

<treeview:SfTreeView
            Name="sfTreeView"           
            ShowLines="True"
            ShowRootLines="True"
            LineStrokeThickness="1.5"
            ChildPropertyName="Childs"
            ItemTemplate="{StaticResource SfTreeView_ItemTemplate}"
            ItemsSource="{Binding Nodes1}" />
sfTreeView.ShowLines = true;
sfTreeView.ShowRootLines = true;
sfTreeView.LineStrokeThickness = 1.5;

WPF TreeView TreeLines Thickness

You can refer to our WPF TreeView feature tour page for its key feature highlights. You can also explore our WPF TreeView example to know how to represent hierarchical data in a tree-like structure with expand and collapse node options.