Class SfTreeView

A SfTreeView class provides a way to display the information in hierarchical structure.

Inheritance

System.Object

SfTreeView

Implements

System.IDisposable

Namespace: Syncfusion.UI.Xaml.TreeView

Assembly: Syncfusion.TreeView.WinUI.dll

Syntax

public class SfTreeView : Control, IDisposable, ITreeCollectionView

Examples

This example demonstrates how to initialize SfTreeView in XAML.

<syncfusion:SfTreeView x:Name="treeView"
                       ChildPropertyName="Files"  
                       ItemsSource="{Binding Folders}">
            <syncfusion:SfTreeView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
            </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView> 

public class NodeWithImageViewModel
{
   public ObservableCollection<Folder> Folders { get; internal set; }
   private ResourceDictionary CommonResourceDictionary { get; set; }
   public NodeWithImageViewModel()
   {
       CommonResourceDictionary = new ResourceDictionary() { Source = new Uri("ms-appx:///Icons/PathIcon.xaml", UriKind.RelativeOrAbsolute) };
       this.Folders = GetFiles();
   }
   private ObservableCollection<Folder> GetFiles()
   {
       var nodeImageInfo = new ObservableCollection<Folder>();
   var doc = new Folder() { FileName = &quot;Documents&quot;, ImageTemplate = CommonResourceDictionary[&quot;Folder&quot;] as DataTemplate };
   var download = new Folder() { FileName = &quot;Downloads&quot;, ImageTemplate = CommonResourceDictionary[&quot;Folder&quot;] as DataTemplate };

   var pollution = new Folder() { FileName = &quot;Environmental Pollution.docx&quot;, ImageTemplate = CommonResourceDictionary[&quot;Word&quot;] as DataTemplate };
   var globalWarming = new Folder() { FileName = &quot;Global Warming.ppt&quot;, ImageTemplate = CommonResourceDictionary[&quot;PowerPoint&quot;] as DataTemplate };
   var sanitation = new Folder() { FileName = &quot;Sanitation.docx&quot;, ImageTemplate = CommonResourceDictionary[&quot;Word&quot;] as DataTemplate };

   var games = new Folder() { FileName = &quot;Game.exe&quot;, ImageTemplate = CommonResourceDictionary[&quot;EXE&quot;] as DataTemplate };
   var tutorials = new Folder() { FileName = &quot;Tutorials.zip&quot;, ImageTemplate = CommonResourceDictionary[&quot;Zip&quot;] as DataTemplate };


   doc.Files = new ObservableCollection&lt;Folder>
   {
       pollution,
       globalWarming,
       sanitation
   };

   download.Files = new ObservableCollection&lt;Folder>
   {
       games,
       tutorials
   };

   nodeImageInfo.Add(doc);
   nodeImageInfo.Add(download);

   return nodeImageInfo;

}
}
public class Folder : NotificationObject
{
private string fileName;
private DataTemplate imageTemplate;
private ObservableCollection<Folder> files;
public Folder()
{
}
public ObservableCollection<Folder> Files
{
get { return files; }
internal set
{
files = value;
RaisePropertyChanged(nameof(Files));
}
}
public string FileName
{
get { return fileName; }
set
{
fileName = value;
RaisePropertyChanged(nameof(FileName));
}
}
public DataTemplate ImageTemplate
{
get { return imageTemplate; }
set { imageTemplate = value; }
}
}

Constructors

SfTreeView()

Initializes a new instance of the SfTreeView class.

Declaration

public SfTreeView()

Fields

AllowDeletingProperty

Identifies the AllowDeleting dependency property.

Declaration

public static readonly DependencyProperty AllowDeletingProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

AllowEditingProperty

Identifies the AllowEditing dependency property.

Declaration

public static readonly DependencyProperty AllowEditingProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

AutoExpandModeProperty

Identifies the AutoExpandMode dependency property.

Declaration

public static readonly DependencyProperty AutoExpandModeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

CheckBoxModeProperty

Identifies the CheckBoxMode dependency property.

Declaration

public static readonly DependencyProperty CheckBoxModeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

CheckedItemsProperty

Identifies the CheckedItems dependency property.

Declaration

public static readonly DependencyProperty CheckedItemsProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ChildPropertyNameProperty

Identifies the ChildPropertyName dependency property.

Declaration

public static readonly DependencyProperty ChildPropertyNameProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

CurrentItemProperty

Identifies the CurrentItem dependency property.

Declaration

public static readonly DependencyProperty CurrentItemProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

EditTemplateProperty

Identifies the EditTemplate dependency property.

Declaration

public static readonly DependencyProperty EditTemplateProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

EditTemplateSelectorProperty

Identifies the EditTemplateSelector dependency property.

Declaration

public static readonly DependencyProperty EditTemplateSelectorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ExpandActionTriggerProperty

Identifies the ExpandActionTrigger dependency property.

Declaration

public static readonly DependencyProperty ExpandActionTriggerProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ExpanderPositionProperty

Identifies the ExpanderPosition dependency property.

Declaration

public static readonly DependencyProperty ExpanderPositionProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ExpanderTemplateProperty

Identifies the ExpanderTemplate dependency property.

Declaration

public static readonly DependencyProperty ExpanderTemplateProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ExpanderTemplateSelectorProperty

Identifies the ExpanderTemplateSelector dependency property.

Declaration

public static readonly DependencyProperty ExpanderTemplateSelectorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ExpanderWidthProperty

Identifies the ExpanderWidth dependency property.

Declaration

public static readonly DependencyProperty ExpanderWidthProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

FocusBorderColorProperty

Identifies the FocusBorderColor dependency property.

Declaration

public static readonly DependencyProperty FocusBorderColorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

FocusBorderThicknessProperty

Identifies the FocusBorderThickness dependency property.

Declaration

public static readonly DependencyProperty FocusBorderThicknessProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

FullRowSelectProperty

Identifies the FullRowSelect dependency property.

Declaration

public static readonly DependencyProperty FullRowSelectProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

HierarchyPropertyDescriptorsProperty

Identifies the HierarchyPropertyDescriptors dependency property.

Declaration

public static readonly DependencyProperty HierarchyPropertyDescriptorsProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

IndentationProperty

Identifies the Indentation dependency property.

Declaration

public static readonly DependencyProperty IndentationProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

IsAnimationEnabledProperty

Identifies the IsAnimationEnabled dependency property.

Declaration

public static readonly DependencyProperty IsAnimationEnabledProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

Remarks

This bindable property is read-only.

ItemContextFlyoutProperty

Identifies the ItemContextFlyout dependency property.

Declaration

public static readonly DependencyProperty ItemContextFlyoutProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ItemHeightProperty

Identifies the ItemHeight dependency property.

Declaration

public static readonly DependencyProperty ItemHeightProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ItemsSourceProperty

Identifies the ItemsSource dependency property.

Declaration

public static readonly DependencyProperty ItemsSourceProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ItemTemplateDataContextTypeProperty

Identifies the ItemTemplateDataContextType dependency property.

Declaration

public static readonly DependencyProperty ItemTemplateDataContextTypeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ItemTemplateProperty

Identifies the ItemTemplate dependency property.

Declaration

public static readonly DependencyProperty ItemTemplateProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ItemTemplateSelectorProperty

Identifies the ItemTemplateSelector dependency property.

Declaration

public static readonly DependencyProperty ItemTemplateSelectorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

LineStrokeProperty

Identifies the LineStroke dependency property.

Declaration

public static readonly DependencyProperty LineStrokeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

LineStrokeThicknessProperty

Identifies the LineStrokeThickness dependency property.

Declaration

public static readonly DependencyProperty LineStrokeThicknessProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

LoadOnDemandCommandProperty

Identifies the LoadOnDemandCommand dependency property.

Declaration

public static readonly DependencyProperty LoadOnDemandCommandProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

NodePopulationModeProperty

Identifies the NodePopulationMode dependency property.

Declaration

public static readonly DependencyProperty NodePopulationModeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

NodesProperty

Identifies the Nodes dependency property.

Declaration

public static readonly DependencyProperty NodesProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

NotificationSubscriptionModeProperty

Identifies the NotificationSubscriptionMode dependency property.

Declaration

public static readonly DependencyProperty NotificationSubscriptionModeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

SelectedItemProperty

Identifies the SelectedItem dependency property.

Declaration

public static readonly DependencyProperty SelectedItemProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

SelectedItemsProperty

Identifies the SelectedItems dependency property.

Declaration

public static readonly DependencyProperty SelectedItemsProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

SelectionBackgroundColorProperty

Identifies the SelectionBackgroundColor dependency property.

Declaration

public static readonly DependencyProperty SelectionBackgroundColorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

SelectionForegroundColorProperty

Identifies the SelectionForegroundColorProperty dependency property.

Declaration

public static readonly DependencyProperty SelectionForegroundColorProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

SelectionModeProperty

Identifies the SelectionMode dependency property.

Declaration

public static readonly DependencyProperty SelectionModeProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ShowLinesProperty

Identifies the ShowLines dependency property.

Declaration

public static readonly DependencyProperty ShowLinesProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

ShowRootLinesProperty

Identifies the ShowRootLines dependency property.

Declaration

public static readonly DependencyProperty ShowRootLinesProperty

Field Value

Type
Microsoft.UI.Xaml.DependencyProperty

Properties

AllowDeleting

Gets or sets a value indicating whether currently selected nodes can be deleted when pressing Delete key.

Declaration

public bool AllowDeleting { get; set; }

Property Value

Type	Description
System.Boolean	true if the user can delete the selected nodes; otherwise, false. The default value is false.

Remarks

You can delete the nodes only if the selection is enabled through SelectionMode. You can listen the following events ItemDeleting and ItemDeleted when you delete the selected nodes via pressing Delete key.

AllowEditing

Gets or sets a value indicating whether all nodes in treeview can be edited or not.

Declaration

public bool AllowEditing { get; set; }

Property Value

Type	Description
System.Boolean	true if the nodes can be edited; Otherwise false. The default value is false.

Remarks

You can use the ItemBeginEdit event and set the TreeViewItemBeginEditEventArgs cancel property as true if you want to disable the editing for particular node.

Examples

This example shows how to enable editing in XAML and C#.

<syncfusion:SfTreeView x:Name="treeView"
                       AllowEditing="True">
</syncfusion:SfTreeView>

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
sfTreeView.AllowEditing = true;

See Also

ItemBeginEdit

AutoExpandMode

Gets or sets the value which indicates how the nodes to be expanded while loading.

Declaration

public AutoExpandMode AutoExpandMode { get; set; }

Property Value

Type	Description
AutoExpandMode	The default value is None. Fields: Enumeration Description RootNodes Root nodes will be expanded. AllNodes All nodes in SfTreeView will be expanded. None Nodes will not be expanded.

CheckBoxMode

Gets or sets the value which indicates how the SfTreeView nodes should be checked either by checking only the exact node or recursively update the child nodes.

Declaration

public CheckBoxMode CheckBoxMode { get; set; }

Property Value

Type	Description
CheckBoxMode	The default value is Individual. Fields: Enumeration Description Individual Update only the treeview node’s IsChecked property value. None Doesn't update the treeview node's IsChecked property value. Recursive Update the treeview node’s and child nodes IsChecked property value recursively.

Remarks

Node It's only applicable for this state only.

See Also

CheckBoxMode

CheckedItems

ItemTemplateDataContextType

CheckedItems

Gets or sets list of checked items list. Maintains list of data objects based on IsChecked property.

Declaration

public ObservableCollection<object> CheckedItems { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<System.Object>	The default value is null.

Remarks

This property maintains checked items only when you are binding ItemsSource to SfTreeView. To support recursive check programatically set CheckBoxMode as Recursive and NodePopulationMode as Instant. It does not support runtime changes in collection which is bind to CheckedItems.

See Also

CheckBoxMode

ItemTemplateDataContextType

NodePopulationMode

ChildPropertyName

Gets or sets the property name for the child object where ItemsSource is used to define the items for this SfTreeView.

Declaration

public string ChildPropertyName { get; set; }

Property Value

Type	Description
System.String	The property name of the child.

Remarks

Use the HierarchyPropertyDescriptor for different types in each level.

Examples

This example demonstrates how to set ChildPropertyName in XAML.

<syncfusion:SfTreeView x:Name="treeView"
                       ChildPropertyName="Files"  
                       ItemsSource="{Binding Folders}">
            <syncfusion:SfTreeView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
            </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView>

See Also

HierarchyPropertyDescriptor

CurrentItem

Gets or sets the current selected item of the SfTreeView.

Declaration

public object CurrentItem { get; set; }

Property Value

Type	Description
System.Object	The current item.

DragDropController

Gets or sets TreeViewDragDropController which controls drag and drop operation in SfTreeView.

Declaration

public TreeViewDragDropController DragDropController { get; set; }

Property Value

Type	Description
TreeViewDragDropController	The default value is TreeViewDragDropController.

EditTemplate

Gets or sets the Microsoft.UI.Xaml.DataTemplate that defines the visual representation of the content view in edit mode for SfTreeView.

Declaration

public DataTemplate EditTemplate { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.DataTemplate	The object that defines the visual representation of the content view in edit mode. The default value is null.

Remarks

The data context for the EditTemplate is based on ItemTemplateDataContextType.

Examples

This example shows how to set EditTemplate property in XAML.

<syncfusion:SfTreeView
           x:Name="treeView"
           AllowEditing="True"
           ItemsSource="{Binding Items}">
    <syncfusion:SfTreeView.ItemTemplate>
        <DataTemplate>
            <TextBlock Text = "{Binding ItemName}" />
        </DataTemplate>
    </syncfusion:SfTreeView.ItemTemplate>
    <syncfusion:SfTreeView.EditTemplate>
        <DataTemplate>
            <TextBox Text = "{Binding ItemName}" />
        </DataTemplate >
    </syncfusion:SfTreeView.EditTemplate>
</syncfusion:SfTreeView>

See Also

ItemTemplateDataContextType

BeginEdit(TreeViewNode)

EndEdit(TreeViewNode)

EditTemplateSelector

Gets or sets the custom logic for choosing a template used to display content view in edit mode.

Declaration

public DataTemplateSelector EditTemplateSelector { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Controls.DataTemplateSelector	A custom Microsoft.UI.Xaml.Controls.DataTemplateSelector object that provides logic and returns a Microsoft.UI.Xaml.DataTemplate. The default is null.

Remarks

The data context for the EditTemplateSelector is based on ItemTemplateDataContextType.

See Also

ItemTemplateDataContextType

ExpandActionTrigger

Gets or sets a value indicating whether expanding and collapsing of nodes can be performed only by tapping in expander view or in both expander view and content view.

Declaration

public ExpandActionTrigger ExpandActionTrigger { get; set; }

Property Value

Type	Description
ExpandActionTrigger	The default value is Expander. Fields: Enumeration Description Expander Specifies that the expanding and collapsing of nodes can be performed only on tapping the expander view... Node Specifies that the expanding and collapsing of nodes can be performed both on tapping the expander view and content view..

ExpanderPosition

Gets or sets the expander position in SfTreeView to decide on start/end position of expander view.

Declaration

public ExpanderPosition ExpanderPosition { get; set; }

Property Value

Type	Description
ExpanderPosition	The default value is Start. Fields: Enumeration Description Start The expander view will be displayed in start position of SfTreeView. End The expander view will be displayed in end position of SfTreeView.

ExpanderTemplate

Gets or sets the data template for the expander view in TreeViewItem.

Declaration

public DataTemplate ExpanderTemplate { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.DataTemplate	The object that defines the visual representation of the expander view. The default value is null.

Remarks

The TreeViewNode will be the data context for each ExpanderTemplate.

Examples

This example demonstrates how to set ExpanderTemplate in XAML.

<converters:BoolToVisibilityConverter x:Key="boolToVisibilityConverter" />
<syncfusion:SfTreeView x:Name="treeView"
                       ChildPropertyName="Files"  
                       ItemsSource="{Binding Folders}">
            <syncfusion:SfTreeView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
            </syncfusion:SfTreeView.ItemTemplate>
            <syncfusion:SfTreeView.ExpanderTemplate>
               <DataTemplate>
                           <Grid  
                             Width="20"
                             Background="Transparent">
                               <Path  
                                 Width="6.061"
                                 Height="8.706"
                                 Data="M0.68398996,0 L6.2700001,4.9960007 0.66699173,10.007999 0,9.2629985 4.7700011,4.9960007 0.016998228,0.74499984 z"
                                 Stretch="Uniform"
                                 Fill="Black" Visibility="{Binding IsExpanded,Converter={StaticResource boolToVisibilityConverter}, ConverterParameter=True}"/>
                               <Path 
                                 Width="8.706"
                                 Height="6.061" 
                                 Data="M0.74499548,0 L5.0119957,4.7700001 9.2630047,0.017000169 10.008001,0.68400005 5.0119957,6.2700001 0,0.66699985 z"
                                 Stretch="Uniform"
                                 Fill="Black" Visibility="{Binding IsExpanded,Converter={StaticResource boolToVisibilityConverter}}"/>
                           </Grid>
                </DataTemplate>
            </syncfusion:SfTreeView.ExpanderTemplate>
</syncfusion:SfTreeView> 

ExpanderTemplateSelector

Gets or sets the custom logic for choosing a template which is used to display expander view in TreeViewItem.

Declaration

public DataTemplateSelector ExpanderTemplateSelector { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Controls.DataTemplateSelector	A custom Microsoft.UI.Xaml.Controls.DataTemplateSelector object that provides logic and returns a Microsoft.UI.Xaml.DataTemplate. The default value is null.

Remarks

The TreeViewNode will be the data context for each data template used in ExpanderTemplateSelector.

Examples

This example demonstrates how to set ExpanderTemplateSelector in both XAML and C#.

<local:ExpandTemplateSelector x:Name="expandTemplateSelector">
   <local:ExpandTemplateSelector.ExpanderTemplate>
        <DataTemplate>
            <Grid x:Name="grid" 
                Width="20"
                Background="Transparent">
                <Path
                    Width = "8.706"
                    Height="6.061" 
                    Data="M0.74499548,0 L5.0119957,4.7700001 9.2630047,0.017000169 10.008001,0.68400005 5.0119957,6.2700001 0,0.66699985 z"
                    Stretch="Uniform"
                    Fill="Black"/>
            </Grid>
         </DataTemplate>
   </local:ExpandTemplateSelector.ExpanderTemplate>
   <local:ExpandTemplateSelector.CollapsedTemplate>
       <DataTemplate>
       <Grid x:Name="grid" 
             Width="20"
             Background="Transparent" >
           <Path
                 Width = "6.061"
                 Height="8.706"
                 Data="M0.68398996,0 L6.2700001,4.9960007 0.66699173,10.007999 0,9.2629985 4.7700011,4.9960007 0.016998228,0.74499984 z"
                 Stretch="Uniform"
                 Fill="Black"/>
       </Grid>
       </DataTemplate>
   </local:ExpandTemplateSelector.CollapsedTemplate>
</local:ExpandTemplateSelector>
<syncfusion:SfTreeView x:Name="treeView"
ChildPropertyName="Files"

ItemsSource="{Binding Folders}"
ExpanderTemplateSelector="{StaticResource expandTemplateSelector}">
<syncfusion:SfTreeView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation = "Horizontal">
<ContentPresenter Width="20"
Height="20"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
ContentTemplate="{Binding ImageTemplate}"/>
<TextBlock Margin = "5"
VerticalAlignment="Center"
Text="{Binding FileName}"/>
</StackPanel>
</DataTemplate>
</syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView> 

using Syncfusion.UI.Xaml.TreeView.Engine;

class ExpandTemplateSelector : DataTemplateSelector
{
    public DataTemplate ExpanderTemplate { get; set; }
    public DataTemplate CollapsedTemplate { get; set; }
    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        var treeviewNode = item as TreeViewNode;
        if (treeviewNode == null)
            return null;

        if (treeviewNode.IsExpanded)
            return ExpanderTemplate;
        else
            return CollapsedTemplate;
   }
}

ExpanderWidth

Gets or sets the width of expander in TreeViewItem.

Declaration

public double ExpanderWidth { get; set; }

Property Value

Type	Description
System.Double	The default value is 30.

FocusBorderColor

Gets or sets the border color for the current focused item.

Declaration

public Brush FocusBorderColor { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Media.Brush	The default color is Microsoft.UI.Colors.Gray.

Remarks

This will be applicable only when SelectionMode is Multiple or Extended.

FocusBorderThickness

Gets or sets the border thickness for the current focused item.

Declaration

public Thickness FocusBorderThickness { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Thickness	The default thickness is 2.

Remarks

This will be applicable only when SelectionMode is Multiple or Extended.

FullRowSelect

Gets or sets a value indicating whether the selection needs to span the whole width of SfTreeView.

Declaration

public bool FullRowSelect { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false.

Remarks

If value is false, the selection will start from indent level only.

HierarchyPropertyDescriptors

Gets or sets the list of HierarchyPropertyDescriptors which holds list of HierarchyPropertyDescriptor that provides information of type and property name. The SfTreeView generates the child nodes based on ChildPropertyName if the type of data object matches TargetType.

Declaration

public HierarchyPropertyDescriptors HierarchyPropertyDescriptors { get; set; }

Property Value

Type	Description
HierarchyPropertyDescriptors	The default value is null.

Examples

This example demonstrates how to set HierarchyPropertyDescriptors in XAML.

<syncfusion:SfTreeView x:Name="treeView"
                       ItemsSource="{Binding Folders}">
           <syncfusion:SfTreeView.HierarchyPropertyDescriptors>
               <treeviewengine:HierarchyPropertyDescriptor ChildPropertyName = "Files"
                                                           TargetType="local:Folder"/>
               <treeviewengine:HierarchyPropertyDescriptor ChildPropertyName = "SubFiles"
                                                           TargetType="local:File"/>
           </syncfusion:SfTreeView.HierarchyPropertyDescriptors>
           <syncfusion:SfTreeView.ItemTemplate>
               <DataTemplate>
                   <StackPanel Orientation = "Horizontal">
                       <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                       <TextBlock Margin = "5"
                                  VerticalAlignment="Center"
                                  Text="{Binding FileName}"/>
                   </StackPanel>
               </DataTemplate>
           </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView>

See Also

HierarchyPropertyDescriptor

Indentation

Gets or sets the distance to indent each child TreeViewItem.

Declaration

public double Indentation { get; set; }

Property Value

Type	Description
System.Double	The default value is 30.

IsAnimationEnabled

Gets or sets a value indicating whether to animate items on expand and collapse.

Declaration

public bool IsAnimationEnabled { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false.

ItemContextFlyout

Gets or sets the context flyout that should appear whenever the context flyout is requested through user interface (UI) from within treeview item.

Declaration

public FlyoutBase ItemContextFlyout { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Controls.Primitives.FlyoutBase	The default value is null.

Remarks

The DataContext for the context flyout is TreeViewItemContextFlyoutInfo.

Examples

This sample shows how to bind the commands in TreeViewCommands to flyout item. The command parameter of flyout item should bound to context flyout's data context when using the commands in TreeViewCommands.

<syncfusion:SfTreeView x:Name="treeView"           
           ItemsSource="{Binding Folders}" 
           ChildPropertyName="SubFiles">
   <syncfusion:SfTreeView.ItemContextFlyout>
       <MenuFlyout>
            <MenuFlyoutItem x:Name="Edit" Text="Edit" Command="{x:Bind syncfusion:TreeViewCommands.Edit}" CommandParameter="{Binding }"/>
        </MenuFlyout>
    </syncfusion:SfTreeView.ItemContextFlyout>
</syncfusion:SfTreeView>
</code>
This example shows how to bind the command in the data context of <see cref="SfTreeView"/>.
The <see cref="TreeViewItemContextFlyoutInfo"/> is the DataContext for <see cref="SfTreeView.ItemContextFlyout "/>,
So you can bind the command in data context of treeview by using <see cref="TreeViewItemContextFlyoutInfo.TreeView"/> as below,
<code lang="XAML">
<syncfusion:SfTreeView x:Name="treeView"           
           ItemsSource="{Binding Folders}" 
           ChildPropertyName="SubFiles">
    <syncfusion:SfTreeView.ItemContextFlyout>
        <MenuFlyout>
            <MenuFlyoutItem x:Name="Expand" Text="Expand" Command="{Binding TreeView.DataContext.ExpandCommand}" CommandParameter="{Binding }"/>
        </MenuFlyout>
    </syncfusion:SfTreeView.ItemContextFlyout>
</syncfusion:SfTreeView>

In above examples, TreeViewItemContextFlyoutInfo is passed as command parameter.

See Also

ItemContextFlyoutOpening

ItemHeight

Gets or sets the height of each TreeViewItem in SfTreeView.

Declaration

public double ItemHeight { get; set; }

Property Value

Type	Description
System.Double	The default value is 40.

ItemsSource

Gets or sets a collection used to generate the items of SfTreeView. The items are initialized based on the ItemTemplateSelector or ItemTemplate property.

Declaration

public object ItemsSource { get; set; }

Property Value

Type	Description
System.Object	The default value is null.

Examples

This example demonstrates how to set ItemsSource in XAML.

<syncfusion:SfTreeView x:Name="treeView"
                       ChildPropertyName="Files"  
                       ItemsSource="{Binding Folders}">
            <syncfusion:SfTreeView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
            </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView>

See Also

ItemTemplate

ItemTemplateSelector

ItemTemplate

Gets or sets the data template for the content view in TreeViewItem.

Declaration

public DataTemplate ItemTemplate { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.DataTemplate	The object that defines the visual representation of the content view. The default value is null.

Remarks

The TreeViewNode will be the data context for each ItemTemplate. For Bound Mode, the binding context of the TreeViewItem is based on the ItemTemplateDataContextType property.

Examples

This example demonstrates how to set ItemTemplate in XAML.

<syncfusion:SfTreeView x:Name="treeView"
                       ChildPropertyName="Files"  
                       ItemsSource="{Binding Folders}">
            <syncfusion:SfTreeView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
            </syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView> 

ItemTemplateDataContextType

Gets or sets the binding context type for items of the SfTreeView. For bound Mode, the binding context of the TreeViewItem is based on the ItemTemplateDataContextType property.

Declaration

public ItemTemplateDataContextType ItemTemplateDataContextType { get; set; }

Property Value

Type	Description
ItemTemplateDataContextType	By default, it will be Item i.e., data object. Fields: Enumeration Description Item The datamodel object will be the binding context for TreeViewItem. Node The TreeViewNode will be the binding context for TreeViewItem.

Remarks

It will be applicable for bound mode only. For ItemTemplate only, it will change and not for TreeViewItem. The CheckBoxMode and CheckedItems are applicable for only Node

ItemTemplateSelector

Gets or sets the custom logic for choosing a template which is used to display content view in TreeViewItem.

Declaration

public DataTemplateSelector ItemTemplateSelector { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Controls.DataTemplateSelector	A custom Microsoft.UI.Xaml.Controls.DataTemplateSelector object that provides logic and returns a Microsoft.UI.Xaml.DataTemplate. The default value is null.

Remarks

The TreeViewNode will be the data context for each data template used in ItemTemplateSelector. For Bound Mode, the binding context of the TreeViewItem is based on theItemTemplateDataContextType property.

Examples

This example demonstrates how to set ItemTemplateSelector in both XAML and C#.

<local:ItemTemplateSelector x:Name="itemTemplateSelector">
   <local:ItemTemplateSelector.ImageTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <ContentPresenter Width="20"
                                          Height="20"
                                          HorizontalAlignment="Stretch"
                                          VerticalAlignment="Center"
                                          ContentTemplate="{Binding ImageTemplate}"/>
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
   </local:ItemTemplateSelector.ImageTemplate>
   <local:ItemTemplateSelector.DefaultTemplate>
                <DataTemplate>
                    <StackPanel Orientation = "Horizontal">
                        <TextBlock Margin = "5"
                                   VerticalAlignment="Center"
                                   Text="{Binding FileName}"/>
                    </StackPanel>
                </DataTemplate>
   </local:ItemTemplateSelector.DefaultTemplate>
</local:ItemTemplateSelector>
<syncfusion:SfTreeView x:Name="treeView"
ChildPropertyName="Files"

ItemsSource="{Binding Folders}"
ItemTemplateSelector="{StaticResource itemTemplateSelector}">
<syncfusion:SfTreeView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation = "Horizontal">
<ContentPresenter Width="20"
Height="20"
HorizontalAlignment="Stretch"
VerticalAlignment="Center"
ContentTemplate="{Binding ImageTemplate}"/>
<TextBlock Margin = "5"
VerticalAlignment="Center"
Text="{Binding FileName}"/>
</StackPanel>
</DataTemplate>
</syncfusion:SfTreeView.ItemTemplate>
</syncfusion:SfTreeView> 

using Syncfusion.UI.Xaml.TreeView.Engine;

class ItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate ImageTemplate { get; set; }
    public DataTemplate DefaultTemplate { get; set; }
    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        var treeviewNode = item as TreeViewNode;
        if (treeviewNode == null)
            return null;

        if (treeviewNode.IsExpanded)
            return ImageTemplate;
        else
            return DefaultTemplate;
   }
}

LineStroke

Gets or sets a brush that defines the background of lines that are drawn between nodes.

Declaration

public SolidColorBrush LineStroke { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Media.SolidColorBrush	The default value is Microsoft.UI.Colors.LightSlateGray.

Examples

This example demonstrates how to set LineStroke in both XAML and C#.

<syncfusion:SfTreeView x:Name="sfTreeView"
ItemsSource="{Binding Folders}"
ShowLines="True"
ShowRootLines="True"
LineStroke="Red"/>

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
sfTreeView.ShowLines = true;
sfTreeView.ShowRootLines = true;
sfTreeView.LineStroke = new SolidColorBrush(Colors.Red);

LineStrokeThickness

Gets or sets a value that defines the thickness of the lines that are drawn between nodes.

Declaration

public double LineStrokeThickness { get; set; }

Property Value

Type	Description
System.Double	The default value is 1.

Examples

This example demonstrates how to set LineStrokeThickness in both XAML and C#.

<syncfusion:SfTreeView x:Name="sfTreeView
ItemsSource="{Binding Folders}"
ShowLines="True"
ShowRootLines="True"
LineStrokeThickness="2"/>

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
sfTreeView.ShowLines = true;
sfTreeView.ShowRootLines = true;
sfTreeView.LineStrokeThickness = 2;

LoadOnDemandCommand

Gets or sets the System.Windows.Input.ICommand which will be executed when tap on the expander.

Declaration

public ICommand LoadOnDemandCommand { get; set; }

Property Value

Type	Description
System.Windows.Input.ICommand	The default value is null.

Remarks

It is applicable for bound mode only. Returns true in CanExecute method of this command to enable expander icon and also to execute on demand loading for that node, else return false.

NodePopulationMode

Gets or sets the value that indicates whether the child nodes should be populated when tree view is loaded or when the node is expanded only.

Declaration

public TreeNodePopulationMode NodePopulationMode { get; set; }

Property Value

Type	Description
TreeNodePopulationMode	The default value is OnDemand. Fields: Enumeration Description OnDemand The child nodes will be populated when the parent nodes are expanded only. Instant All the nodes will be populated when SfTreeView is initially loaded

Remarks

This property is applicable for Bound mode only.

Nodes

Gets or sets the collection of tree view nodes that are assigned to SfTreeView in Unbound mode.

Declaration

public TreeViewNodeCollection Nodes { get; set; }

Property Value

Type	Description
TreeViewNodeCollection	The default value is null.

Examples

This example demonstrates how to set Nodes in XAML.

<Syncfusion:SfTreeView x:Name="treeView">
    <Syncfusion:SfTreeView.Nodes>
        <Engine:TreeViewNode Content = "Grains" IsExpanded="True">
            <Engine:TreeViewNode.ChildNodes>
                <Engine:TreeViewNode Content = "Cereals" IsExpanded="True">
                    <Engine:TreeViewNode.ChildNodes>
                        <Engine:TreeViewNode Content = "Rice"/>
                        <Engine:TreeViewNode Content = "Barley"/>
                    </Engine:TreeViewNode.ChildNodes>
                </Engine:TreeViewNode>
                <Engine:TreeViewNode Content = "Oilseeds">
                    <Engine:TreeViewNode.ChildNodes>
                        <Engine:TreeViewNode Content = "Safflower"/>
                    </Engine:TreeViewNode.ChildNodes>
                </Engine:TreeViewNode>
            </Engine:TreeViewNode.ChildNodes>
        </Engine:TreeViewNode>
    </Syncfusion:SfTreeView.Nodes>
</Syncfusion:SfTreeView>

NotificationSubscriptionMode

Gets or sets the value that indicates whether to subscribe collection and property changes of data object to perform real time data update. When binding ItemsSource, then the SfTreeView subscribes to collection and property changes of data object based on NotificationSubscriptionMode.

Declaration

public NotificationSubscriptionMode NotificationSubscriptionMode { get; set; }

Property Value

Type	Description
NotificationSubscriptionMode	The default value is None. Fields: Enumeration Description CollectionChange The SfTreeView will update its tree structure when child items collection gets changed. PropertyChange The SfTreeView will update its child items when associated collection property gets changed.

Remarks

By default, the view listens to System.ComponentModel.INotifyPropertyChanging.PropertyChanging and System.ComponentModel.INotifyPropertyChanged.PropertyChanged events of data object and System.Collections.Specialized.INotifyCollectionChanged.CollectionChanged event of sourceCollection.

Examples

SfTreeView treeView = new SfTreeView();
treeView.NotificationSubscriptionMode = NotificationSubscriptionMode.CollectionChange | NotificationSubscriptionMode.PropertyChange;

SelectedItem

Gets or sets the first selected item of the SfTreeView.

Declaration

public object SelectedItem { get; set; }

Property Value

Type	Description
System.Object	The first selected item.

SelectedItems

Gets or sets the collection of object that contains data item that are selected in the SfTreeView.

Declaration

public ObservableCollection<object> SelectedItems { get; set; }

Property Value

Type
System.Collections.ObjectModel.ObservableCollection<System.Object>

SelectionBackgroundColor

Gets or sets the selection background color for the selected item.

Declaration

public Brush SelectionBackgroundColor { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Media.Brush	The default value is Microsoft.UI.Colors.Gainsboro.

SelectionForegroundColor

Gets or sets the selected item foreground color of the SfTreeView.

Declaration

public Brush SelectionForegroundColor { get; set; }

Property Value

Type	Description
Microsoft.UI.Xaml.Media.Brush	The default value is Microsoft.UI.Colors.MidnightBlue.

Remarks

It will applicable for unbound mode only.

SelectionMode

Gets or sets the selection mode of the SfTreeView.

Declaration

public SelectionMode SelectionMode { get; set; }

Property Value

Type

Description

SelectionMode

By default, the selection mode of the SfTreeView is Single. Fields: Enumeration Description Single Allows selecting the single item only. When clicking on the selected item, selection will not be cleared. SingleDeselect Allows selecting the single item only. When clicking on the selected item, selection gets cleared. None Allows disabling the selection for SfTreeView. Multiple Allows selecting more than one item. Selection is not cleared when selecting more than one items. When clicking on the selected item, selection gets cleared. Extended Allows to select the multiple items using the common key modifiers.

ShowLines

Gets or sets a value indicating whether lines are drawn between tree nodes in the SfTreeView.

Declaration

public bool ShowLines { get; set; }

Property Value

Type	Description
System.Boolean	true if lines are drawn between tree nodes in the SfTreeView; otherwise, false. The default value is false.

Remarks

Line can be customized by using LineStroke and LineStrokeThickness properties. Also, you can avoid the line between root tree nodes by setting the ShowRootLines property as false.

ShowRootLines

Gets or sets a value indicating whether lines are drawn between the tree nodes that are at the root of the SfTreeView.

Declaration

public bool ShowRootLines { get; set; }

Property Value

Type	Description
System.Boolean	true if lines are drawn between the tree nodes that are at the root of the tree view; otherwise, false. The default value is true.

Remarks

The root lines is applicable only if the ShowLines property value is true.

Methods

BeginEdit(TreeViewNode)

Initiates the edit operation on the specific node.

Declaration

public void BeginEdit(TreeViewNode treeViewNode)

Parameters

Type	Name	Description
TreeViewNode	treeViewNode	A TreeViewNode node to edit.

Examples

This example demonstrates how to call BeginEdit(TreeViewNode) method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.BeginEdit(sfTreeView.Nodes[0]);

BringIntoView(TreeViewNode, Boolean, Boolean, ScrollToPosition)

Attempts to bring the TreeViewItem into view by scrolling.

Declaration

public void BringIntoView(TreeViewNode item, bool disableAnimation = false, bool canExpand = false, ScrollToPosition scrollToPosition)

Parameters

Type	Name	Description
TreeViewNode	item	Represents the TreeViewNode to scroll.
System.Boolean	disableAnimation	true to disable scroll animation while changing the view; otherwise, false. The default is false.
System.Boolean	canExpand	true to expand the collapsed nodes and bring the collapsed node into view; otherwise, false. The default is false.
ScrollToPosition	scrollToPosition	Defines position in the view to which node is scrolled.

Remarks

Need to set NodePopulationMode property to Instant for populating all the nodes to bring the collapsed node into view while calling this method with 'canExpand' parameter as true.

Examples

This example demonstrates how to call BringIntoView(TreeViewNode, Boolean, Boolean, ScrollToPosition) method in C#.

using Syncfusion.UI.Xaml.TreeView; 
using Syncfusion.UI.Xaml.TreeView.Engine
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
TreeViewNode Cereals = new TreeViewNode();
Cereals.Content = "Cereals";
TreeViewNode Rice = new TreeViewNode();
Rice.Content = "Rice";
TreeViewNode Barley = new TreeViewNode();
Barley.Content = "Barley";
Cereals.ChildNodes.Add(Rice);
Cereals.ChildNodes.Add(Barley);
sfTreeView.Nodes.Add(Cereals);

Root.Children.Add(sfTreeView);
sfTreeView.BringIntoView(Cereals, true, false, ScrollToPosition.Start);

BringIntoView(Object, Boolean, Boolean, ScrollToPosition)

Attempts to bring the TreeViewItem into view by scrolling.

Declaration

public void BringIntoView(object dataObject, bool disableAnimation = false, bool canExpand = false, ScrollToPosition scrollToPosition)

Parameters

Type	Name	Description
System.Object	dataObject	Represents the data object associated with TreeViewNode to scroll.
System.Boolean	disableAnimation	true to disable scroll animation while changing the view; otherwise, false. The default is false.
System.Boolean	canExpand	true to expand the collapsed nodes and bring the collapsed node into view; otherwise, false. The default is false.
ScrollToPosition	scrollToPosition	Defines position in the view to which object is scrolled.

Remarks

Need to set NodePopulationMode property to Instant for populating all the nodes to bring the collapsed node into view while calling this method with 'canExpand' parameter as true.

Examples

This example demonstrates how to call BringIntoView(TreeViewNode, Boolean, Boolean, ScrollToPosition)method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.BringIntoView((DataContext as FileManagerViewModel).ImageNodeInfo[0], false, true, ScrollToPosition.Start);

CollapseAll()

Collapses all the nodes in the SfTreeView.

Declaration

public void CollapseAll()

Examples

This example demonstrates how to call CollapseAll()method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.CollapseAll();

CollapseNode(TreeViewNode)

Collapses the specified TreeViewNode.

Declaration

public void CollapseNode(TreeViewNode treeViewNode)

Parameters

Type	Name	Description
TreeViewNode	treeViewNode	Specifies the TreeViewNode to collapse it from the view.

Examples

This example demonstrates how to call CollapseNode(TreeViewNode)method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView. CollapseNode(sfTreeView.Nodes[0]);

CollapseNodes(Int32)

Collapses all the tree view items based on the specified level.

Declaration

public void CollapseNodes(int level = -1)

Parameters

Type	Name	Description
System.Int32	level	Specifies the level of TreeViewNode to collapse all the TreeViewItem from the view.

Examples

This example demonstrates how to call CollapseNodes(Int32) method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.CollapseNodes(0);

Dispose()

Dispose all the allocated resources.

Declaration

public void Dispose()

Dispose(Boolean)

Dispose the instances, if parameter is true.

Declaration

protected virtual void Dispose(bool disposing)

Parameters

Type	Name	Description
System.Boolean	disposing	Represents the boolean value for disposing objects.

EndEdit(TreeViewNode)

Ends the edit operation on the specific node.

Declaration

public void EndEdit(TreeViewNode treeViewNode)

Parameters

Type	Name	Description
TreeViewNode	treeViewNode	A TreeViewNode to end the editing.

Examples

This example demonstrates how to call EndEdit(TreeViewNode) method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
sfTreeView.EndEdit(node);

See Also

BeginEdit(TreeViewNode)

ExpandAll()

Expands all the nodes in the SfTreeView.

Declaration

public void ExpandAll()

Examples

This example demonstrates how to call ExpandAll() method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.ExpandAll();

ExpandNode(TreeViewNode)

Expands the specified TreeViewNode.

Declaration

public void ExpandNode(TreeViewNode treeViewNode)

Parameters

Type	Name	Description
TreeViewNode	treeViewNode	Specifies the TreeViewNode to expand it in the view.

Examples

This example demonstrates how to call ExpandNode(TreeViewNode) method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.ExpandNode(sfTreeView.Nodes[0]);

ExpandNodes(Int32)

Expands all the TreeViewItem based on the specified level.

Declaration

public void ExpandNodes(int level = -1)

Parameters

Type	Name	Description
System.Int32	level	Specifies the level of TreeViewNode to expand all the TreeViewItems in the view.

Examples

This example demonstrates how to call ExpandNodes(Int32) method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.ExpandNodes(0);

GetNodeAt(Point)

Retrieves the TreeViewNode that is at the specified point.

Declaration

public TreeViewNode GetNodeAt(Point point)

Parameters

Type	Name	Description
Windows.Foundation.Point	point	The Windows.Foundation.Point to evaluate and retrieve the node from.

Returns

Type	Description
TreeViewNode	Returns the TreeViewNode that is at the specified point or null if there is no node at the location.

MeasureOverride(Size)

This method is used to get the desired size of an element.

Declaration

protected override Size MeasureOverride(Size availableSize)

Parameters

Type	Name	Description
Windows.Foundation.Size	availableSize	The available size for the element to use.

Returns

Type	Description
Windows.Foundation.Size	A System.Drawing.Size which contains the desired size of the element.

OnApplyTemplate()

Builds the visual tree for the SfTreeView.

Declaration

protected override void OnApplyTemplate()

OnCreateAutomationPeer()

Declaration

protected override AutomationPeer OnCreateAutomationPeer()

Returns

Type
Microsoft.UI.Xaml.Automation.Peers.AutomationPeer

OnKeyDown(KeyRoutedEventArgs)

Invoked when the KeyDown attached event reaches an element in its route that is derived from this class. Implement this method to add class handling for this event.

Declaration

protected override void OnKeyDown(KeyRoutedEventArgs e)

Parameters

Type	Name	Description
Microsoft.UI.Xaml.Input.KeyRoutedEventArgs	e	The Microsoft.UI.Xaml.Input.KeyRoutedEventArgs that contains the event data.

SelectAll()

Select all the items in the SfTreeView.

Declaration

public void SelectAll()

Examples

This example demonstrates how to call SelectAll() method in C#.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView sfTreeView = new SfTreeView();
TreeViewNode Fruits = new TreeViewNode();
Fruits.Content = "Fruits";
TreeViewNode Apple = new.TreeViewNode();
Apple.Content = "Apple";
TreeViewNode Orange = new TreeViewNode();
Orange.Content = "Orange";
Fruits.ChildNodes.Add(Apple);
Fruits.ChildNodes.Add(Orange);
sfTreeView.Nodes.Add(Fruits);
sfTreeView.SelectAll();

Events

ItemBeginEdit

Occurs when the TreeViewItem enters edit mode.

Declaration

public event EventHandler<TreeViewItemBeginEditEventArgs> ItemBeginEdit

Event Type

Type
System.EventHandler<TreeViewItemBeginEditEventArgs>

Remarks

You can cancel the editing of certain nodes by using this event.

Examples

This example demonstrates how to handle ItemBeginEdit event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemBeginEdit += TreeView_ItemBeginEdit;
private void TreeView_ItemBeginEdit(object sender, TreeViewItemBeginEditEventArgs e)
{
if (e.Node.Content == "Grains")
e.Cancel = true;
}
}

See Also

ItemEndEdit

ItemContextFlyoutOpening

Occurs when ItemContextFlyout of treeview is opened.

Declaration

public event EventHandler<ItemContextFlyoutOpeningEventArgs> ItemContextFlyoutOpening

Event Type

Type
System.EventHandler<ItemContextFlyoutOpeningEventArgs>

Remarks

You can cancel showing the treeview ItemContextFlyout by setting the ItemContextFlyoutOpeningEventArgs cancel property as true.

ItemDeleted

Occurs after the TreeViewNode is deleted when Delete key is pressed.

Declaration

public event EventHandler<ItemDeletedEventArgs> ItemDeleted

Event Type

Type
System.EventHandler<ItemDeletedEventArgs>

Remarks

You can handle selection after removing the node using this event.

Examples

This example demonstrates how to move the selection to first node after delete all the selected nodes by handling ItemDeleted event.

<syncfusion:SfTreeView x:Name="treeView"
                     AllowDeleting="True"
                     ItemDeleted="TreeView_ItemDeleted">
</syncfusion:SfTreeView>

private void TreeView_ItemDeleted (object sender, ItemDeletedEventArgs e)
{
    if(this.treeView.Nodes.Count > 0)
    {
        this.treeView.SelectedItem = this.treeView.Nodes[0].Content;
    }
}

ItemDeleting

Occurs when the TreeViewNode is being deleted when Delete key is pressed.

Declaration

public event EventHandler<ItemDeletingEventArgs> ItemDeleting

Event Type

Type
System.EventHandler<ItemDeletingEventArgs>

Remarks

You can cancel deleting for certain nodes by using this event.

Examples

This example demonstrates how to handle ItemDeleting event.

<syncfusion:SfTreeView x:Name="treeView"
                     AllowDeletingNode="True"
                     ItemDeleting="TreeView_ItemDeleting">
</syncfusion:SfTreeView>

private void TreeView_ItemDeleting (object sender, ItemDeletingEventArgs e)
{
    e.Cancel = true;
}

ItemDoubleTapped

Occurs when the content ciew of the TreeViewItem is double tapped in the SfTreeView.

Declaration

public event EventHandler<ItemDoubleTappedEventArgs> ItemDoubleTapped

Event Type

Type
System.EventHandler<ItemDoubleTappedEventArgs>

Examples

This example demonstrates how to handle ItemDoubleTapped event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemDoubleTapped += TreeView_ItemDoubleTapped;
void TreeView_ItemDoubleTapped(object sender, ItemDoubleTappedEventArgs e)
{
MessageBox.Show("TreeView item is double tapped.");
}

ItemDragStarted

Occurs when drag and drop operation is started in the SfTreeView.

Declaration

public event EventHandler<TreeViewItemDragStartedEventArgs> ItemDragStarted

Event Type

Type
System.EventHandler<TreeViewItemDragStartedEventArgs>

Examples

This example demonstrates how to handle ItemDragStarted event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemDragStarted += TreeView_ItemDragStarted;
void TreeView_ItemDragStarted (object sender, TreeViewItemDragStartedEventArgs e)
{
}

ItemDragStarting

Occurs when drag and drop operation is starting in the SfTreeView.

Declaration

public event EventHandler<TreeViewItemDragStartingEventArgs> ItemDragStarting

Event Type

Type
System.EventHandler<TreeViewItemDragStartingEventArgs>

Remarks

You can cancel the dragging for certain nodes.

Examples

This example demonstrates how to handle ItemDragStarting event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemDragStarting += TreeView_ItemDragStarting;
void TreeView_ItemDragStarting (object sender, TreeViewItemDragStartingEventArgs e)
{
e.Cancel = true;
}

ItemDropped

Occurs when item is dropped within the targeted SfTreeView.

Declaration

public event EventHandler<TreeViewItemDroppedEventArgs> ItemDropped

Event Type

Type
System.EventHandler<TreeViewItemDroppedEventArgs>

Examples

This example demonstrates how to handle ItemDropped event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemDropped += TreeView_ItemDropped;
void TreeView_ItemDropped(object sender, TreeViewItemDroppedEventArgs e)
{
}

ItemDropping

Occurs when item is dropping within the targeted SfTreeView.

Declaration

public event EventHandler<TreeViewItemDroppingEventArgs> ItemDropping

Event Type

Type
System.EventHandler<TreeViewItemDroppingEventArgs>

Remarks

You can cancel the drop operation over certain nodes or change the position where the dragged nodes are going to drop by using this event.

Examples

This example demonstrates how to handle ItemDropping event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemDropping += TreeView_ItemDropping;
void TreeView_ItemDropping(object sender, TreeViewItemDroppingEventArgs e)
{
e.Cancel = true;
}

ItemEndEdit

Occurs when the TreeViewItem leaves edit mode.

Declaration

public event EventHandler<TreeViewItemEndEditEventArgs> ItemEndEdit

Event Type

Type
System.EventHandler<TreeViewItemEndEditEventArgs>

Remarks

You can cancel the editing from being ended for certain nodes by using this event.

Examples

This example demonstrates how to handle ItemEndEdit event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemEndEdit += TreeView_ItemEndEdit;
private void TreeView_ItemEndEdit(object sender, TreeViewItemEndEditEventArgs e)
{
if (e.Node.Content == "Balnc")
e.Cancel = true;
}
}

ItemHolding

Occurs when the content view of TreeViewItem is long pressed in SfTreeView.

Declaration

public event EventHandler<ItemHoldingEventArgs> ItemHolding

Event Type

Type
System.EventHandler<ItemHoldingEventArgs>

Examples

This example demonstrates how to handle ItemHolding event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemHolding += TreeView_ItemHolding;
void TreeView_ItemHolding(object sender, ItemHoldingEventArgs e)
{
MessageBox.Show("TreeView item is holding.");
}

ItemTapped

Occurs when the content view of the TreeViewItem is tapped in the SfTreeView.

Declaration

public event EventHandler<ItemTappedEventArgs> ItemTapped

Event Type

Type
System.EventHandler<ItemTappedEventArgs>

Examples

This example demonstrates how to handle ItemTapped event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.ItemTapped += TreeView_ItemTapped;
void TreeView_ItemTapped(object sender, ItemTappedEventArgs e)
{
MessageBox.Show("TreeView item is tapped.");
}

NodeChecked

Occurs when an IsChecked property value is changed.

Declaration

public event EventHandler<NodeCheckedEventArgs> NodeChecked

Event Type

Type
System.EventHandler<NodeCheckedEventArgs>

Examples

This example demonstrates how to handle NodeChecked event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.NodeChecked += TreeView_NodeChecked;
void TreeView_NodeChecked(object sender, NodeCheckedEventArgs e)
{
}

NodeCollapsed

Occurs when an TreeViewNode is collapsed in the SfTreeView.

Declaration

public event EventHandler<NodeExpandedCollapsedEventArgs> NodeCollapsed

Event Type

Type
System.EventHandler<NodeExpandedCollapsedEventArgs>

Examples

This example demonstrates how to use NodeCollapsed event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.NodeCollapsed += TreeView_NodeCollapsed;
private void TreeView_NodeCollapsed(object sender, NodeExpandedCollapsedEventArgs e)
{
//You can write your own code.
}

See Also

NodeCollapsing

NodeCollapsing

Occurs before an TreeViewNode is collapsed in the SfTreeView.

Declaration

public event EventHandler<NodeExpandingCollapsingEventArgs> NodeCollapsing

Event Type

Type
System.EventHandler<NodeExpandingCollapsingEventArgs>

Remarks

The NodeCollapsing event is a cancellable event and can be cancelled by handling the event and setting the Cancel property to true. However, if the event is cancelled, the collapse process for the TreeViewNode gets cancelled.

Examples

This example demonstrates how to use NodeCollapsing event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.NodeCollapsing += TreeView_NodeCollapsing;
void TreeView_NodeCollapsing(object sender, NodeExpandingCollapsingEventArgs e)
{
if(e.Node.Level == 1)
e.Cancel = true;
}

NodeExpanded

Occurs when an TreeViewNode is expanded in the SfTreeView.

Declaration

public event EventHandler<NodeExpandedCollapsedEventArgs> NodeExpanded

Event Type

Type
System.EventHandler<NodeExpandedCollapsedEventArgs>

Examples

This example demonstrates how to use NodeExpanded event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.NodeExpanded += TreeView_NodeExpanded;
private void TreeView_NodeExpanded(object sender, NodeExpandedCollapsedEventArgs e)
{
//You can write your own code.
}

NodeExpanding

Occurs when an TreeViewNode is being expanded in the SfTreeView.

Declaration

public event EventHandler<NodeExpandingCollapsingEventArgs> NodeExpanding

Event Type

Type
System.EventHandler<NodeExpandingCollapsingEventArgs>

Remarks

The NodeExpanding event is a cancellable event and can be cancelled by handling the event and setting the Cancel property to true. However, if the event is cancelled, the expand process for the TreeViewNode gets cancelled.

Examples

This example demonstrates how to use NodeExpanding event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.NodeExpanding += TreeView_NodeExpanding;
private void TreeView_NodeExpanding(object sender, NodeExpandingCollapsingEventArgs e)
{
if(e.Node.Level == 1)
e.Cancel = true;
}

See Also

NodeCollapsed

QueryNodeSize

Occurs whenever an item comes into view and query the item size.

Declaration

public event EventHandler<QueryNodeSizeEventArgs> QueryNodeSize

Event Type

Type
System.EventHandler<QueryNodeSizeEventArgs>

Remarks

SfTreeView supports auto height feature, by using this event. We can define whether the specified size can be set to the item or not by handling the QueryNodeSize event.

Examples

This example demonstrates how to handle QueryNodeSize event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.QueryNodeSize += TreeView_QueryNodeSize;
void TreeView_QueryNodeSize (object sender, QueryNodeSizeEventArgs e)
{
e.Height = 40;
e.Handled = true;
}

SelectionChanged

Occurs once the selection process has been completed for the selected item in the SfTreeView.

Declaration

public event EventHandler<ItemSelectionChangedEventArgs> SelectionChanged

Event Type

Type
System.EventHandler<ItemSelectionChangedEventArgs>

Examples

This example demonstrates how to handle SelectionChanged event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.SelectionChanged += TreeView_SelectionChanged;
private void TreeView_SelectionChanged(object sender, ItemSelectionChangedEventArgs e)
{
treeView.SelectedItems.Clear();
}

SelectionChanging

Occurs while selecting an item's content view at the execution time.

Declaration

public event EventHandler<ItemSelectionChangingEventArgs> SelectionChanging

Event Type

Type
System.EventHandler<ItemSelectionChangingEventArgs>

Remarks

The SelectionChanging event is a cancellable event and can be cancelled by handling the event and setting the Cancel property to true. However, if the event is cancelled, the selection process for the selected TreeViewItem's content view gets cancelled.

Examples

This example demonstrates how to handle SelectionChanging event.

using Syncfusion.UI.Xaml.TreeView;
SfTreeView treeView = new SfTreeView();
treeView.SelectionChanging += TreeView_SelectionChanging;
private void TreeView_SelectionChanging(object sender, ItemSelectionChangingEventArgs e)
{
if (e.AddedItems.Count > 0 && e.AddedItems[0] == ViewModel.Items[0])
e.Cancel = true;
}

See Also

SelectionChanged

Implements

System.IDisposable