WPF TreeView HierarchicalDataTemplate Binding

Question

I have Server, which has a list of Databases. I have Database which has a list of Tables and Views. I have a helper property called Children on Database which consists of a Union between Tables and Views.

Below is my TreeView Xaml for this, which works great! Except, i want to have a static node for Tables and Views with Tables and Views listed under these static nodes. How do i achieve this?

<TreeView Name="tvServer">
   <TreeView.Resources>

      <!-- Server -->
      <HierarchicalDataTemplate DataType="{x:Type ostsql:Server}" ItemsSource="{Binding Databases}">
         <StackPanel Orientation="Horizontal">
            <Image Width="16" Height="16" Margin="3,0" Source="/Ost.Applications.CodeGenerator.Application;component/Images/SqlServer.png" />
            <TextBlock Text="{Binding ConnectionString}" />
         </StackPanel>
      </HierarchicalDataTemplate>

      <!-- Database -->
      <HierarchicalDataTemplate DataType="{x:Type ostsql:Database}" ItemsSource="{Binding Children}">
         <StackPanel Orientation="Horizontal">
            <Image Width="16" Height="16" Margin="3,0" Source="/Ost.Applications.CodeGenerator.Application;component/Images/Database.png" />
            <TextBlock Text="{Binding Name}" />
         </StackPanel>
      </HierarchicalDataTemplate>

      <!-- Table -->
      <DataTemplate DataType="{x:Type ostsql:Table}">
         <StackPanel Orientation="Horizontal">
            <Image Width="16" Height="16" Margin="3,0" Source="/Ost.Applications.CodeGenerator.Application;component/Images/Table.png" />
            <TextBlock Text="{Binding QualifiedName}" />
         </StackPanel>
      </DataTemplate>

      <!-- View -->
      <DataTemplate DataType="{x:Type ostsql:View}">
         <StackPanel Orientation="Horizontal">
            <Image Width="16" Height="16" Margin="3,0" Source="/Ost.Applications.CodeGenerator.Application;component/Images/View.png" />
            <TextBlock Text="{Binding QualifiedName}" />
         </StackPanel>
      </DataTemplate>
   </TreeView.Resources>
</TreeView>

What do you mean by "static nodes"? Do you mean you want the root of your TreeView to have Server, Tables and Views nodes? — Mark Green
I want my database node to have Tables and Views by default. The Tables or Views nodes will listed Tables and Views respectively if there are any. Pretty much similar to how SQL Server Mnagement studio does it. — c0D3l0g1c

Sheridan Sheridan · Accepted Answer · 2014-03-07T14:26:59

Your question is very unclear and you have not shown us all of the relevant code. However, you seem to be asking how to display your Table and View objects in a TreeView. In order to display a node in a TreeView, you must have a data item in the collection that is data bound to the TreeView.ItemsSource property. So, clearly the quick answer is for you to add some Table and View objects into your collection.

Now I can only assume that you didn't ask this question to find that out. I'm guessing that you are really asking how you can combine objects from different classes into one collection. The answer to that is also simple. The way to add items from different classes into one collection is for you to create a base class that your various data type classes extend and have your collection contain these base class elements:

public class BaseDataType { ... }

public class Table : BaseDataType { ... }

public class View : BaseDataType { ... }

public class Database : BaseDataType { ... }

public class Server : BaseDataType { ... }

Then in your view model, you could have this property:

public ObservableCollection<BaseDataType> Items { get; set; }

...

Items.Add(new Table());
Items.Add(new View());
Items.Add(new Database());
Items.Add(new Server());

Then in the XAML:

<TreeView Name="tvServer" ItemsSource="{Binding Items}" ... />

WPF TreeView HierarchicalDataTemplate Binding

1 Answers