WPF Programmatically create treeview itemtemplate/columns

Question

I have an application that reads database tables and puts it into a treeview. The current ItemTemplate for the treeview looks like this:

<TreeView.ItemTemplate>
    <HierarchicalDataTemplate ItemsSource="{Binding SubOrganLocations}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="35" />
                <ColumnDefinition Width="35" />
                <ColumnDefinition Width="35" />
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" Text="{Binding OrganDisplayName}" />
            <TextBox Grid.Column="1" IsEnabled="True" />
            <TextBox Grid.Column="2" IsEnabled="True" />
            <TextBox Grid.Column="3" IsEnabled="True" />
        </Grid>
    </HierarchicalDataTemplate>
</TreeView.ItemTemplate>

However, in the future there could be more columns that need to be added (determined by the number of distinct values in a table), so I'm trying to create it dynamically. How would I go about doing that?

Replace your grid with a custom control that takes whatever object you are using for your `ItemSource` and creates the grid dynamically. As far as I know, you cant do what you are looking for declaritively in XAML. — FlyingStreudel, May 26 '11 at 15:12
Thanks, I didn't think it could be done in XAML, that's why I was getting a bit confused. How do I go about creating a custom control? And since that will be creating the grid (instead of the XAML code), what would the corresponding XAML code look like? — Saggio, May 26 '11 at 15:17

score 2 · Accepted Answer · answered Jun 10 '11 at 20:51

Something like this might be possible:

<TreeView.ItemTemplate>
    <HierarchicalDataTemplate ItemsSource="{Binding SubOrganLocations}">
        <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding OrganDisplayName}" />

                <!-- If the fields to bind to can be exposed via a collection:
                <ItemsControl ItemsSource="{Binding Fields}"> -->
                <ItemsControl ItemsSource="{Binding, Converter={StaticResource SomeCleverConverter}}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Horizontal" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <TextBox Text="{Binding Value}" Width="35" />
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

            </StackPanel>
    </HierarchicalDataTemplate>
</TreeView.ItemTemplate>

It depends if the DataContext of the TreeViewItem (the SubOrganLocation) can expose a collection of fields, or at least be used to derive them with a converter. The simplest and probably easiest would be to expose a collection of fields so you can just do {Binding Fields}.

Dave Clemmer · Answer 2 · 2011-05-26T15:38:08.333

As FlyingStreudel said, using custom controls is a good approach in this case. The XAML would look something like:

        <!-- entity 1 -->
        <HierarchicalDataTemplate DataType="{x:Type local:Entity1}" ItemsSource="{Binding Items, Mode=OneWay}">
            <Grid>
                <local:Entity1Control/>
            </Grid>
        </HierarchicalDataTemplate>

        <!-- entity 2 (leaf) -->
        <DataTemplate DataType="{x:Type local:Entity2}">
            <Grid>
                <local:Entity2Control />
            </Grid>
        </DataTemplate>

You don't have to use custom controls, you can put your specific columns in each template.

WPF Programmatically create treeview itemtemplate/columns

2 Answers2

Linked