WPF: Icons in TreeView

Question

Hi all,

Please help to the newbie in WPF!

I need to build a TreeView with icons+text in TreeViewItems when the Treeview is bounded to an XML data file.

Here is my XML:

<Root>
<Node Name="AAA" Image="images/1.ico" />
<Node Name="BBB" Image="images/2.ico">
 <ChildNode Name="bbb 1" Image="images/3.ico">
  <GrandchildNode Name="b 1.1" Image="images/4.ico"/>
  <GrandchildNode Name="b 1.2" Image="images/5.ico"/>
  <GrandchildNode Name="b 1.3" Image="images/6.ico"/>
 </ChildNode>
 <ChildNode Name="bbb 2" Image="images/7.ico"/>
 <ChildNode Name="bbb 3" Image="images/8.ico">
  <GrandchildNode Name="b 3.1" Image="images/9.ico"/>
  <GrandchildNode Name="b 3.2" Image="images/10.ico"/>
 </ChildNode>
 <ChildNode Name="bbb 4" Image="images/11.ico"/>
</Node>
<Node Name="CCC" Image="images/12.ico">
 <ChildNode Name="ccc 1" Image="images/13.ico">
  <GrandchildNode Name="c 1.1" Image="images/14.ico"/>
  <GrandchildNode Name="c 2.2" Image="images/15.ico"/>
 </ChildNode>
</Node></Root>

Thanks in advance!!!

Answer 1

Use TreeView.ItemTemplate to create a template for the items which displays what you want.

<TreeView ItemsSource="{Binding Source={StaticResource myItemsSource}}">
  <TreeView.ItemTemplate>
    <HierarchicalDataTemplate>
      <StackPanel Orientation="Horizontal">
        <Image Source="{Binding Image}" Margin="0,0,5,0" />
        <TextBlock Text="{Binding Name}" />
      </StackPanel>
    </HierarchicalDataTemplate>
  </TreeView.ItemTemplate>
</TreeView>

Edit: I copied and quickly modified the above XAML without much thinking about it. Just realized the bindings given aren't going to work for you, since your data source is XML. Don't have the time to correct that, but the idea should be self evident enough to help you on your way.