CODEWITHSUNDEEP
c#wpfxamltreeviewhierarchicaldatatemplate
user2799180
user2799180

Reputation: 749

WPF TreeView add custom Header to HierarchicalDataTemplates

I created a simple example that contains a list of classes and a list of students within the class. This gives a TreeView like this:

school
|-class1
  |-student1
  |-student1
|-class2
...

But what I want is a look like this:

school
|-CLASSES
  |-class1
    |-STUDENTS
      |-student1
      |-student1
  |-class2
  ...

I would like to do this without altering the objects bound to the TreeView. It would be perfect if I could add a custom (CLASSES, STUDENTS, etc...) naming somehow to each HierarchicalDataTemplate.

How can I achieve this?

Here is my basis:

C# Classses needed

public class School
    {
        public string name { get; set; }
        public List<Classi> classes { get; set; }
    }
    public class Classi
    {
        public string name { get; set; }
        public List<Student> students { get; set; }
    }
    public class Student
    {
        public string name { get; set; }
    }

C# List bound to TreeView

private List<object> _items = new List<object>();
        public List<object> items
        {
            get
            {
                return _items;
            }
            set
            {
                _items = value;
                NotifyOfPropertyChange(() => items);
            }
        }

C# Filling my school

var stud1 = new Student { name = "student1" };
var stud2 = new Student { name = "student2" };
var clas1 = new Classi { name = "class1" };
clas1.students = new List<Student>();
clas1.students.Add(stud1);
var clas2 = new Classi { name = "class2" };
clas2.students = new List<Student>();
clas2.students.Add(stud2);
var school = new School();
school.name = "school";
school.classes = new List<Classi>();
school.classes.Add(clas1);
school.classes.Add(clas2);
items.Add(school);

XAML The TreeView containing the HierarchicalDataTemplates

<TreeView ItemsSource="{Binding items}">
            <TreeView.Resources>
                <HierarchicalDataTemplate ItemsSource="{Binding classes}" DataType="{x:Type src:School}">
                    <TextBlock Text="{Binding name}" />
                </HierarchicalDataTemplate>
                <HierarchicalDataTemplate ItemsSource="{Binding students}" DataType="{x:Type src:Classi}">
                    <TextBlock Text="{Binding name}" />
                </HierarchicalDataTemplate>

                <DataTemplate DataType="{x:Type src:Student}">
                    <TextBlock Text="{Binding name}" />
                </DataTemplate >
            </TreeView.Resources>
        </TreeView>

Upvotes: 3

Views: 2533

Answers (1)

bitman
bitman

Reputation: 567

It's an old question, but since I was searching for an answer for a very similar problem, for the reference here's one possible (not very general) solution.

<Window.Resources>
    <HierarchicalDataTemplate x:Key="studentTemplate">
        <TextBlock Text="{Binding Path=name}" />
    </HierarchicalDataTemplate>

    <HierarchicalDataTemplate x:Key="classesTemplate">
        <TreeViewItem Header="{Binding Path=name}" >
            <TreeViewItem Header="STUDENTS" ItemsSource="{Binding Path=students}"
                    ItemTemplate="{StaticResource studentTemplate}"/>
        </TreeViewItem>
    </HierarchicalDataTemplate>

    <HierarchicalDataTemplate x:Key="schoolTemplate">
        <TreeViewItem Header="{Binding Path=name}" >
            <TreeViewItem Header="CLASSES" ItemsSource="{Binding Path=classes}"
                    ItemTemplate="{StaticResource classesTemplate}"/>
        </TreeViewItem>
    </HierarchicalDataTemplate>
</Window.Resources>

<TreeView Name="thisTree" ItemTemplate="{StaticResource schoolTemplate}" />

The solution is "inspired" by this and this

Upvotes: 1

Related Questions