2013-06-02 26 views
0

我無法爲treeviewitems動態添加圖像。爲treeviewitems動態更改imges

TreeViewItem tvi = new TreeViewItem { Header = ni.name, Uid = itemName, Background = color}; 

這裏是我的XAML

<TreeView.Resources> 
    <Style TargetType="{x:Type TreeViewItem}"> 
     <Setter Property="HeaderTemplate"> 
      <Setter.Value> 
       <DataTemplate> 
        <StackPanel Orientation="Horizontal"> 
         <Image Margin="2" Source="/Citi.Shade;component/Control/Images/folder1.jpg"/> 
               <TextBlock Margin="2" Text="{Binding}"></TextBlock> 
        </StackPanel> 
       </DataTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</TreeView.Resources> 

我看到添加到所有的物品圖像,但是如果我想根據項目是否是一個文件夾或文件2個圖像之間的動態決定,我不確定如何去做。我不知道如何將它添加到我創建的TreeViewItem中的標題。在添加treeviewitem之前以編程方式創建堆棧面板模板,就像我在這個問題中發佈的一樣,並不能提供幫助。 Treeviewitem with images programmatically

回答

1

用綁定這應該很容易。下面我分享了我創建的示例代碼。

XAML:

<TreeView Name="treeView"> 
    <TreeView.ItemContainerStyle> 
     <Style TargetType="{x:Type TreeViewItem}"> 
      <Setter Property="IsExpanded" Value="{Binding IsExpanded, Mode=TwoWay}" /> 
      <Setter Property="IsSelected" Value="{Binding IsSelected, Mode=TwoWay}" /> 
      <Setter Property="FontWeight" Value="Normal" /> 
      <Style.Triggers> 
       <Trigger Property="IsSelected" Value="True"> 
        <Setter Property="FontWeight" Value="Bold" /> 
       </Trigger> 
      </Style.Triggers> 
     </Style> 
    </TreeView.ItemContainerStyle> 
    <TreeView.ItemTemplate> 
     <HierarchicalDataTemplate ItemsSource="{Binding SubElements}"> 
      <StackPanel Orientation="Horizontal"> 
       <Image Margin="2" Source="{Binding ImageLocation}" Height="30" Width="30"/> 
       <TextBlock Margin="2" Text="{Binding HeaderText}" Background="{Binding BackgroundColor}"></TextBlock> 
      </StackPanel> 
     </HierarchicalDataTemplate> 
    </TreeView.ItemTemplate> 
</TreeView> 

代碼隱藏:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Imaging; 
using System.Windows.Navigation; 
using System.Windows.Shapes; 

namespace WpfApplication1 
{ 
    public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 

      List<TreeViewElement> elements = new List<TreeViewElement>(); 
      TreeViewElement mainElement = new TreeViewElement() { ImageLocation = "Images/1.png", HeaderText = "MainElement1" }; 
      mainElement.SubElements = new List<TreeViewElement>(); 
      mainElement.SubElements.Add(new TreeViewElement() { ImageLocation = "Images/2.png", HeaderText = "SubElement1" }); 
      mainElement.SubElements.Add(new TreeViewElement() { ImageLocation = "Images/2.png", HeaderText = "SubElement2", BackgroundColor = "Blue" }); 
      elements.Add(mainElement); 
      TreeViewElement mainElement2 = new TreeViewElement() { HeaderText = "MainElement2" }; 
      elements.Add(mainElement2); 
      this.treeView.ItemsSource = elements; 
     } 
    } 

    public class TreeViewElement 
    { 
     public string ImageLocation { get; set; } 
     public string HeaderText { get; set; } 
     public string BackgroundColor { get; set; } 
     public List<TreeViewElement> SubElements { get; set; } 
    } 
} 

下面的文章將幫助您瞭解綁定和TreeView控制。

http://www.codeproject.com/Articles/26288/Simplifying-the-WPF-TreeView-by-Using-the-ViewMode

http://www.codeproject.com/Articles/390514/Playing-with-a-MVVM-Tabbed-TreeView-for-a-File-Exp

+0

謝謝這很有幫助 –

0

我想通了這一點。我不得不把TreeViewItem創建更改爲:

TreeViewItem tvi = new TreeViewItem 
{ 
    Header = new TreeItem() { 
           iName = ni.name, 
           iImage = img 
          }, 
      Uid = itemName, 
      Background = color 
}; 

TreeItem是一個自定義類,我創建它看起來像這樣:

public class TreeItem 
{ 
    public string iName 
    { 
     get; 
     set; 
    } 

    public string iImage 
    { 
     get; 
     set; 
    } 
    } 

各自XAML結合將是:

<TreeView.Resources> 
    <Style TargetType="{x:Type TreeViewItem}"> 
     <Setter Property="HeaderTemplate"> 
      <Setter.Value> 
       <DataTemplate> 
        <StackPanel Orientation="Horizontal"> 
         <Image Source="{Binding Path=iImage}"/> 
         <TextBlock VerticalAlignment="Center" Text="{Binding Path=iName}"></TextBlock> 
        </StackPanel> 
       </DataTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</TreeView.Resources>