Share via


TreeView.ItemTemplate Property

Definition

Gets or sets the DataTemplate used to display each item.

Equivalent WinUI 2 API for UWP: Microsoft.UI.Xaml.Controls.TreeView.ItemTemplate (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

DataTemplate ItemTemplate();

void ItemTemplate(DataTemplate value);
public DataTemplate ItemTemplate { get; set; }
var dataTemplate = treeView.itemTemplate;
treeView.itemTemplate = dataTemplate;
Public Property ItemTemplate As DataTemplate
<TreeView>
  <TreeView.ItemTemplate>
    singleDataTemplate
  </TreeView.ItemTemplate>
</TreeView>
- or -
<TreeView ItemTemplate="resourceReferenceToDataTemplate"/>

Property Value

The template that specifies the visualization of the data objects. The default is null.

Windows requirements

Device family
Windows 10, version 1809 (introduced in 10.0.17763.0)
API contract
Windows.Foundation.UniversalApiContract (introduced in v7.0)

Examples

This example shows how to apply a DataTemplate for a locally defined Item object. For the code that defines Item and populates the TreeView, see the "Tree view using data binding" example in the TreeView article.

<TreeView Name="DessertTree"
          SelectionMode="Multiple"
          ItemsSource="{x:Bind DataSource}">
    <TreeView.ItemTemplate>
        <DataTemplate x:DataType="local:Item">
            <TreeViewItem ItemsSource="{x:Bind Children}"
                          Content="{x:Bind Name}"/>
        </DataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

Remarks

In Windows 10, version 1803, there is no ItemTemplate property. Instead, you have to re-template the TreeView control and specify a custom ItemTemplate if your content is not a string. This example shows how to apply a DataTemplate to a tree view item in Windows 10, version 1803. For the code that defines Item and populates the TreeView, see the "Tree view using data binding" example in the TreeView article.

<Page.Resources>
    <DataTemplate x:Key="TreeViewItemDataTemplate" x:DataType="local:Item">
        <TreeViewItem ItemsSource="{x:Bind Children}"
                      Content="{x:Bind Name}"/>
    </DataTemplate>

    <Style TargetType="TreeView">
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="TreeView">
                    <TreeViewList x:Name="ListControl"
                                  ItemTemplate="{StaticResource TreeViewItemDataTemplate}"
                                  ItemContainerStyle="{StaticResource TreeViewItemStyle}"
                                  CanDragItems="True"
                                  AllowDrop="True"
                                  CanReorderItems="True">
                        <TreeViewList.ItemContainerTransitions>
                            <TransitionCollection>
                                <ContentThemeTransition />
                                <ReorderThemeTransition />
                                <EntranceThemeTransition IsStaggeringEnabled="False" />
                            </TransitionCollection>
                        </TreeViewList.ItemContainerTransitions>
                    </TreeViewList>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>
<Grid>
    <TreeView Name="DessertTree"
              ItemsSource="{x:Bind DataSource}"/>
</Grid>

Applies to