WPF TreeView基于数据类型的头部、子项及文本显示配置求助

需求目标 #

需要实现如下层级结构的TreeView：

> {Name} {ParentButton}
 > ParentData.Text
 > {Name} {ChildButton}
  > ChildData.Text
  > {Name} {ChildButton}
   > ...
> {Name} {ParentButton}
 > ParentData.Text
 > ...

现有实现代码 #

XAML代码 #

<TreeView ItemsSource="{Binding Models}">
  <TreeView.Resources>
    <HierarchicalDataTemplate DataType="{x:Type models:ParentModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ParentData.Name}"></Label>
        <Button Content="MyParentButton" Command="{Binding ParentButton}"></Button>
      </StackPanel>
    </HierarchicalDataTemplate>
    <!-- 注意：原代码存在拼写错误，Hierarhical应为Hierarchical -->
    <HierarchicalDataTemplate DataType="{x:Type models:ChildModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ChildData.Name}"></Label>
        <Button Content="MyChildButton" Command="{Binding ChildButton}"></Button>
      </StackPanel>
    </HierarchicalDataTemplate>
  </TreeView.Resources>
</TreeView>

模型类代码 #

ParentModel.cs

public class ParentModel {
  public ParentOnlyObj ParentData { get; }
  public ICommand ParentButton { get; }
  public ObservableCollection<ChildModel> Children { get; }
}

ChildModel.cs

public class ChildModel {
  public ChildOnlyObj ChildData { get; }
  public ICommand ChildButton { get; }
  public ObservableCollection<ChildModel> Children { get; }
}

当前问题 #

现有实现无法显示ParentData.Text和ChildData.Text节点，缺少对应文本行的显示逻辑，需补充该部分实现并支持ChildModel的嵌套。

解决方案 #

方案1：扩展模型结构（推荐，支持完整嵌套逻辑） #

核心思路是新增文本节点模型，让所有TreeView节点继承统一基类，将文本项作为子节点加入集合：

1. 创建通用基类与文本节点模型

// 所有TreeView节点的基类
public abstract class TreeItemBase { }

// 修改ParentModel继承基类，更新Children集合类型
public class ParentModel : TreeItemBase {
  public ParentOnlyObj ParentData { get; }
  public ICommand ParentButton { get; }
  // 集合改为可容纳TreeItemBase子类（ChildModel和TextItem）
  public ObservableCollection<TreeItemBase> Children { get; }
}

// 修改ChildModel继承基类，更新Children集合类型
public class ChildModel : TreeItemBase {
  public ChildOnlyObj ChildData { get; }
  public ICommand ChildButton { get; }
  public ObservableCollection<TreeItemBase> Children { get; }
}

// 新增文本节点模型
public class TextItem : TreeItemBase {
  public string Text { get; set; }
}

2. 初始化时添加文本节点
   在模型构造函数中，将ParentData.Text和ChildData.Text包装成TextItem加入子集合：

public ParentModel(ParentOnlyObj parentData, ICommand parentButton) {
  ParentData = parentData;
  ParentButton = parentButton;
  Children = new ObservableCollection<TreeItemBase>();
  // 插入文本节点
  Children.Add(new TextItem { Text = parentData.Text });
}

public ChildModel(ChildOnlyObj childData, ICommand childButton) {
  ChildData = childData;
  ChildButton = childButton;
  Children = new ObservableCollection<TreeItemBase>();
  // 插入文本节点
  Children.Add(new TextItem { Text = childData.Text });
}

3. 更新XAML模板
   添加TextItem的数据模板，修正原模板的拼写错误：

<TreeView ItemsSource="{Binding Models}">
  <TreeView.Resources>
    <HierarchicalDataTemplate DataType="{x:Type models:ParentModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ParentData.Name}"/>
        <Button Content="MyParentButton" Command="{Binding ParentButton}" Margin="5,0,0,0"/>
      </StackPanel>
    </HierarchicalDataTemplate>
    <HierarchicalDataTemplate DataType="{x:Type models:ChildModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ChildData.Name}"/>
        <Button Content="MyChildButton" Command="{Binding ChildButton}" Margin="5,0,0,0"/>
      </StackPanel>
    </HierarchicalDataTemplate>
    <!-- 文本节点的显示模板 -->
    <DataTemplate DataType="{x:Type models:TextItem}">
      <Label Content="{Binding Text}"/>
    </DataTemplate>
  </TreeView.Resources>
</TreeView>

方案2：仅修改XAML模板（视觉层面，不改动模型） #

若不想调整模型结构，可通过模板嵌套实现文本显示，但该方案仅支持视觉呈现，文本节点无法参与复杂交互或嵌套逻辑：

<TreeView ItemsSource="{Binding Models}">
  <TreeView.Resources>
    <HierarchicalDataTemplate DataType="{x:Type models:ParentModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ParentData.Name}"/>
        <Button Content="MyParentButton" Command="{Binding ParentButton}" Margin="5,0,0,0"/>
      </StackPanel>
      <!-- 自定义子项模板，先显示ParentData.Text -->
      <HierarchicalDataTemplate.ItemTemplate>
        <DataTemplate>
          <StackPanel>
            <Label Content="{Binding DataContext.ParentData.Text, RelativeSource={RelativeSource AncestorType=TreeViewItem}}"/>
            <!-- 再显示ChildModel的内容 -->
            <StackPanel Orientation="Horizontal" DataContext="{Binding}">
              <Label Content="{Binding ChildData.Name}"/>
              <Button Content="MyChildButton" Command="{Binding ChildButton}" Margin="5,0,0,0"/>
            </StackPanel>
          </StackPanel>
        </DataTemplate>
      </HierarchicalDataTemplate.ItemTemplate>
    </HierarchicalDataTemplate>
    <HierarchicalDataTemplate DataType="{x:Type models:ChildModel}" ItemsSource="{Binding Children}">
      <StackPanel Orientation="Horizontal">
        <Label Content="{Binding ChildData.Name}"/>
        <Button Content="MyChildButton" Command="{Binding ChildButton}" Margin="5,0,0,0"/>
      </StackPanel>
      <!-- 自定义子项模板，先显示ChildData.Text -->
      <HierarchicalDataTemplate.ItemTemplate>
        <DataTemplate>
          <StackPanel>
            <Label Content="{Binding DataContext.ChildData.Text, RelativeSource={RelativeSource AncestorType=TreeViewItem}}"/>
            <!-- 再显示子级ChildModel的内容 -->
            <StackPanel Orientation="Horizontal" DataContext="{Binding}">
              <Label Content="{Binding ChildData.Name}"/>
              <Button Content="MyChildButton" Command="{Binding ChildButton}" Margin="5,0,0,0"/>
            </StackPanel>
          </StackPanel>
        </DataTemplate>
      </HierarchicalDataTemplate.ItemTemplate>
    </HierarchicalDataTemplate>
  </TreeView.Resources>
</TreeView>

内容的提问来源于stack exchange，提问作者AsdTulip