带图标的简单WPF数据绑定问题

本文关键字:数据绑定 问题 WPF 简单 图标 | 更新日期: 2023-09-27 17:50:33

我有几个类型组成一个层次结构,像这样:

+ Image0.Name
    Effect0.Name
    Effect1.Name
    Effect2.Name
    Layer0.Name
    Layer1.Name
    Layer2.Name
    ...
+ Image1.Name
    Effect0.Name
    Effect1.Name
    Effect2.Name
    Layer0.Name
    Layer1.Name
    Layer2.Name
    ...
+ Image2.Name
    Effect0.Name
    Effect1.Name
    Effect2.Name
    Layer0.Name
    Layer1.Name
    Layer2.Name
    ...

但是我搞不懂数据绑定。以下是类型的代码:

public class Image
{
    public string Name { get; set; }
    public IEnumerable<Effect> Effects { get; set; }
    public IEnumerable<Layer> Layers { get; set; }
}
public class Effect
{
    public string Name { get; set; }
    public Effect ( string name )
    {
        this.Name = name;
    }
}
public class Layer
{
    public string Name { get; set; }
    public Layer ( string name )
    {
        this.Name = name;
    }
}
public class EditorView : INotifyPropertyChanged
{
    IEnumerable<Node> images;
    public IEnumerable<Node> Images
    {
        get { return images; }
        set
        {
            this.images = value;
            this.RaisePropertyChanged ( "Images" );
        }
    }
    public event PropertyChangedEventHandler PropertyChanged;
    void RaisePropertyChanged ( string propertyName )
    {
        var handler = this.PropertyChanged;
        if ( handler != null )
            handler ( this, new PropertyChangedEventArgs ( propertyName ) );
    }
}

另外,这些类型(Effect, Layer)每个类型都有一个独特的图标,如果你能告诉我如何绑定它,这将有助于我理解这一切。

带图标的简单WPF数据绑定问题

我通常是这样做的,为子项创建一个基类然后创建I属性返回所有子项

 public class Image 
 { 
    public string Name { get; set;} 
    public IEnumerable<Effect> Effects { get; set; } 
    public IEnumerable<Layer> Layers { get; set; }
    public IEnumerable<Node> Nodes { get { return ((IEnumerable<Node>)Layers).Union((IEnumerable<Node>)Effects); } }
}
 public class Effect : Node
{
    public Effect(string name) 
    { 
        this.Name = name; 
    } 
}
public class Layer : Node
{ 
      public Layer(string name) { this.Name = name; } 
}
public class Node
{
    public string Name { get; set; }
    public Image Icon { get; set; }
}

你应该能够设置图像属性(url的图像,但你可以改变属性类型)各自的效果和图层然后我已经连接了它,这应该工作

 <TreeView Height="221" HorizontalAlignment="Left" Margin="12,12,0,0" Name="treeView1" 
              VerticalAlignment="Top" Width="479" ItemsSource="{Binding Images}">
        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate ItemsSource="{Binding Nodes}">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Name}"></TextBlock>
                    <Image Source="{Binding Icon}"></Image>
                </StackPanel>
            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>
    </TreeView>

编辑

然后将TreeView项目的DataContext设置为ViewModel,就像我在后面的代码中做的那样:

Image img = new Image();
Effect effect = new Effect("Effect1");
Layer layer = new Layer("Layer1");
img.Name = "Image1";
List<Effect> effects = new List<Effect>();
effects.Add(effect);
img.Effects = effects;
List<Layer> layers = new List<Layer>();
layers.Add(layer);
img.Layers = layers;
List<WpfApplication1.Image> Images = new List<Image>();
Images.Add(img);
EditorView ev = new EditorView();
ev.Images = Images;
treeView1.DataContext = ev;

EDIT2:粘贴完整代码(不使用语句):

namespace WpfApplication1
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        this.DataContext = new EditorView();
    }
}
public class Image 
{ 
    public string Name { get; set;} 
    public IEnumerable<Effect> Effects { get; set; } 
    public IEnumerable<Layer> Layers { get; set; }
    public IEnumerable<Node> Nodes { get { return ((IEnumerable<Node>)Layers).Union((IEnumerable<Node>)Effects); } }
}
public class Effect : Node
{
    public Effect(string name) 
    { 
        this.Name = name; 
    } 
}
public class Layer : Node
{ 
      public Layer(string name) { this.Name = name; } 
}
public class Node
{
    public string Name { get; set; }
    public string Icon { get; set; }
}
public class EditorView : INotifyPropertyChanged 
{
    public EditorView()
    {
        Image img = new Image();
        WpfApplication1.Effect effect = new WpfApplication1.Effect("Effect1");
        WpfApplication1.Layer layer = new Layer("Layer1");
        img.Name = "Image1";
        List<Effect> effects = new List<WpfApplication1.Effect>();
        effects.Add(effect);
        img.Effects = effects;
        List<Layer> layers = new List<Layer>();
        layers.Add(layer);
        img.Layers = layers;
        List<WpfApplication1.Image> Images = new List<Image>();
        Images.Add(img);
        this.Images = Images;
    }
    IEnumerable<Image> images;
    public IEnumerable<Image> Images 
    { 
        get 
    { 
            return images; 
    } 
        set { this.images = value; this.RaisePropertyChanged("Images"); 
        } 
    } public event 
        PropertyChangedEventHandler 
        PropertyChanged; 
    void RaisePropertyChanged(string propertyName) 
    { var handler = this.PropertyChanged; 
        if (handler != null)            
            handler(this, new PropertyChangedEventArgs(propertyName)); 
    } 
}
}

需要实现HierarchicalDataTemplate。查看本文的最后一个示例- http://msdn.microsoft.com/en-us/library/ms742521.aspx和这个- http://blogs.msdn.com/b/chkoenig/archive/2008/05/24/hierarchical-databinding-in-wpf.aspx