如何在WPF TreeView中的節點旁添加圖標？

Question

我有一個WPF TreeView只有1級的項目。 TreeView是綁定到一個ObservableCollection的字符串的數據。我如何確保在TreeView中的每個節點的左側出現相同的圖標？

Answer 1

我認爲最好的方法是在TreeView上設置一個Style，它將更改TreeViewItems的模板以獲得所需的圖像。

模板可能需要是一個帶有圖像和標籤控件的StackPanel，將圖像綁定到圖標，並將標籤文本綁定到Observable集合中的字符串。

我已經從Code Project article中複製了相關的代碼片斷，其中涵蓋了更詳細的內容，但我認爲以下是您需要的全部內容（此代碼位於TreeView.Resources元素中）。

<Style TargetType="{x:Type TreeViewItem}"> 
    <Setter Property="HeaderTemplate"> 
     <Setter.Value> 
      <DataTemplate> 
       <StackPanel Orientation="Horizontal"> 
        <Image Name="img" 
          Width="20" 
          Height="20" 
          Stretch="Fill" 
          Source="image.png"/> 
        <TextBlock Text="{Binding}" Margin="5,0" /> 
       </StackPanel> 
      </DataTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 2

我認爲，這將有助於您瞭解TreeView的是這一個http://www.codeproject.com/KB/WPF/TreeViewWithViewModel.aspx最好的文章之一。通常，這描述了一組很好的模式，可以使WPF/SL中的很多場景變得更加容易。

Answer 3

我用James Osborn的StackPanel technique這樣...

XAML：

<TreeView Name="TreeViewThings" ItemsSource="{Binding}"> 
    <TreeView.Resources> 
     <HierarchicalDataTemplate DataType="{x:Type local:Thing}" 
            ItemsSource="{Binding Children}"> 
      <StackPanel Orientation="Horizontal" Margin="2"> 
       <Image Source="Thing.png" 
         Width="16" 
         Height="16" 
         SnapsToDevicePixels="True"/> 
       <TextBlock Text="{Binding Path=Name}" Margin="5,0"/> 
      </StackPanel> 
     </HierarchicalDataTemplate> 
    </TreeView.Resources> 
</TreeView>