How can I change the TreeView Icon into a folder icon?

Question

I'm trying to change the icon of my TreeView in a folder icon. Also when it collapses it needs to have an opened folder icon.

My treeview has databound items in it and the code is:

<TreeView x:Name="TreeViewCategories"  Grid.Row="0" Grid.Column="1" Height="610" HorizontalAlignment="Left"  Margin="29,111,0,0" VerticalAlignment="Top" Width="315" BorderThickness="0" Background="Transparent" >
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate  ItemsSource="{Binding Items}">
            <TextBlock FontSize="20" Text="{Binding Name}" PreviewMouseDown="TextBlock_PreviewMouseDown"/>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>

Also this is how I fill the treeview with items from XML (It's a snipped out of alot of code:

private void LoadHospitalXML()
{
    try
    {
        FileStream fs = new FileStream("ConfigOrgHospital.xml", FileMode.Open, FileAccess.Read);

        var xml = XmlReader.Create(fs);

        rootElement = ConvertHospitalData(xml);

        this.TreeViewCategories.ItemsSource = null;
        List<HospitalWrapper> li = new List<HospitalWrapper>();
        var hosp = rootElement.Items.FirstOrDefault();
        if (hosp != null)
        {
            foreach (var i in hosp.Hospital)
            {
                li.AddIfNotNull(CreateHospList(i));
            }
        }

        this.TreeViewCategories.ItemsSource = li;
    }
    catch (Exception e)
    {
        MessageBox.Show(e.Message);
    }

}

private HospitalWrapper CreateHospList(object obj)
{
    var newItem = new HospitalWrapper();

    newItem.Context = obj;
    //Hospital Names//
    if (obj is HospitalDataHospitalsHospital)
    {
        var hosp = (HospitalDataHospitalsHospital)obj;

        //newItem.Title = "Hospitals";
        newItem.Name = hosp.DefaultName;

        var tmp = new HospitalWrapper();
        tmp.Name = "Sites";
        tmp.IsTitle = true;

        if (hosp.Sites != null)
            foreach (var i in hosp.Sites)
            {
                tmp.Items.AddIfNotNull(CreateHospList(i));
            }
        newItem.Items.Add(tmp);

        tmp = new HospitalWrapper();
        tmp.Name = "Specialties";
        tmp.IsTitle = true;

        if (hosp.Deps != null)
            foreach (var j in hosp.Deps)
            {

                tmp.Items.AddIfNotNull(CreateHospList(j));
            }

        newItem.Items.Add(tmp);
    }
}

Entirely

Answer 1

Incidentally i did something like this just a few days ago. In my application a folder icon is added in the HierarchicalDataTemplate to those objects which behave like folders, i use a trigger to change the icon based on whether the item is expanded or not, here's the relevant bit of XAML:

    <HierarchicalDataTemplate DataType="{x:Type data:FeedComposite}"
                              ItemsSource="{Binding Path=Children}">
        <StackPanel Orientation="Horizontal" Margin="1">
            <StackPanel.Children>
                <Image>
                    <Image.Style>
                        <Style BasedOn="{StaticResource IconImageStyleSmall}" TargetType="Image">
                            <Setter Property="Source" Value="{Binding Source={StaticResource Icon_FolderClosed}, Mode=OneTime}"/>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=TreeViewItem}, Path=IsExpanded}" Value="True">
                                    <Setter Property="Source" Value="{Binding Source={StaticResource Icon_FolderOpen}, Mode=OneTime}"/>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Image.Style>
                </Image>
                <TextBlock Text="{Binding Title}"/>
            </StackPanel.Children>
        </StackPanel>
    </HierarchicalDataTemplate>

Where {StaticResource Icon_FolderOpen} and {StaticResource Icon_FolderClosed} are BitmapImages that hold the icons for the folder states. IconImageStyleSmall is a style which sets the MaxWidth and MaxHeight of the images to something appropriate.

---

Edit: For completion's sake.

<BitmapImage x:Key="Icon_FolderOpen"   UriSource="pack://application:,,,/ImageResources/Icons/FolderOpen.ico"   />
<BitmapImage x:Key="Icon_FolderClosed" UriSource="pack://application:,,,/ImageResources/Icons/FolderClosed.ico" />

<Style x:Key="IconImageStyleSmall" TargetType="Image">
    <Setter Property="MaxWidth" Value="16"/>
    <Setter Property="MaxHeight" Value="16"/>
    <Setter Property="Margin" Value="1"/>
</Style>

Icons used

Cagliari

I'm doing this in mine as well, but one problem I keep running into is that when all the children are removed from the folder, I would like it to show the FolderClosed icon. Is there a simple way to do this that doesn't require watching the children's CollectionChanged event? (The tree view only shows the expansion arrow when there are children present, so I'd like to hook into that same mechanism if possible.) – Meteorology

@NielW: No idea, you might want to ask a separate question, maybe someone else does. I for one have not used WPF in quite a while. – Cagliari