HierarchicalDataTemplate中的DataTemplate

Question

我需要构建一个自定义treeview作为用户控件。我把它叫做为例子TreeViewEx的缘故：

<UserControl x:Class="WpfApplication4.TreeViewEx" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      x:Name="root"> 
    <Grid> 
     <TreeView ItemsSource="{Binding Path=ItemsSource, ElementName=root}"> 
      <TreeView.ItemTemplate> 
       <HierarchicalDataTemplate ItemsSource="{Binding Children}"> 
        <StackPanel Orientation="Horizontal"> 
         <TextBlock Text="Node : "/> 
         <ContentControl Content="{Binding Path=AdditionalContent, ElementName=root}"/> 
        </StackPanel> 
       </HierarchicalDataTemplate> 
      </TreeView.ItemTemplate> 
     </TreeView> 
    </Grid> 
</UserControl> 

的想法是有ItemTemplate中的内容和它的可定制部分的固定部分。

当然，我创建的TreeViewEx类两个依赖属性：

public partial class TreeViewEx 
{ 
    public static readonly DependencyProperty ItemsSourceProperty = DependencyProperty.Register(
     "ItemsSource", typeof(IEnumerable), typeof(TreeViewEx)); 

    public IEnumerable ItemsSource 
    { 
     get { return (IEnumerable)GetValue(ItemsSourceProperty); } 
     set { SetValue(ItemsSourceProperty, value); } 
    } 

    public static readonly DependencyProperty AdditionalContentProperty = DependencyProperty.Register(
     "AdditionalContent", typeof(object), typeof(TreeViewEx)); 

    public object AdditionalContent 
    { 
     get { return GetValue(AdditionalContentProperty); } 
     set { SetValue(AdditionalContentProperty, value); } 
    } 

    public TreeViewEx() 
    { 
     InitializeComponent(); 
    } 
} 

有一个简单的节点类，像这样：

public class Node 
{ 
    public string Name { get; set; } 
    public int Size { get; set; } 
    public IEnumerable<Node> Children { get; set; } 
} 

我会喂树视图。我把TreeViewEx的实例在WPF测试项目的主窗口：

<Window x:Class="WpfApplication4.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525" 
     xmlns:local="clr-namespace:WpfApplication4"> 
    <Grid> 
     <local:TreeViewEx x:Name="tree"> 
      <local:TreeViewEx.AdditionalContent> 
       <TextBlock Text="{Binding Name}"/> 
      </local:TreeViewEx.AdditionalContent> 
     </local:TreeViewEx> 
    </Grid> 
</Window> 

最后给它：

public partial class MainWindow 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 

     var dummyData = new ObservableCollection<Node> 
     { 
      new Node 
      { 
       Name = "Root", 
       Size = 3, 
       Children = new ObservableCollection<Node> 
       { 
        new Node{ 
         Name="Child1", 
         Size=2, 
         Children = new ObservableCollection<Node>{ 
          new Node{ 
           Name = "Subchild", 
           Size = 1 
          } 

         } 
        } 

       } 
      } 
     }; 

     tree.ItemsSource = dummyData; 
    } 
} 

然而，它作为第一个即预期ContentControl中有数据不起作用但是当我展开节点时，它不显示ContentControl的内容。

我真的不明白..我应该使用DataTemplate还是其他？

Answer 1

问题是您将内容设置为控件的实例，并且该控件只能有一个父级。当您展开树并将其添加到第二个节点时，它会将其从第一个节点中删除。

正如你怀疑的那样，你想为TreeViewEx提供一个DataTemplate而不是一个控件。您可以使用ContentPresenter在树的每个级别来实例化模板：

public static readonly DependencyProperty AdditionalContentTemplateProperty = DependencyProperty.Register(
    "AdditionalContentTemplate", typeof(DataTemplate), typeof(TreeViewEx)); 

public DataTemplate AdditionalContentTemplate 
{ 
    get { return (DataTemplate)GetValue(AdditionalContentTemplateProperty); } 
    set { SetValue(AdditionalContentTemplateProperty, value); } 
} 

改变你UserControl的XAML的HierarchicalDataTemplate到：

与更换AdditionalContentProperty

<StackPanel Orientation="Horizontal"> 
    <TextBlock Text="Node : "/> 
    <ContentPresenter ContentTemplate="{Binding Path=AdditionalContentTemplate, ElementName=root}"/> 
</StackPanel> 

和变化主窗口到：

<local:TreeViewEx x:Name="tree"> 
    <local:TreeViewEx.AdditionalContentTemplate> 
     <DataTemplate> 
      <TextBlock Text="{Binding Name}"/> 
     </DataTemplate> 
    </local:TreeViewEx.AdditionalContentTemplate> 
</local:TreeViewEx>