Question

我正在使用XamDataTree，我需要节点图标为每种类型的节点提供不同的图像。我试过了asking this on Infragistics，但我们互不理解:(

此外，问题实际上与他们的控制无关，它是关于如何获取存储在模型中的图像来显示。是的，这违反了MVVM的原则，但这是展示图像的唯一可行方式。

注意：我有一个解决方法，使用Label指定节点内容并在其中放置一个水平stackpanel，其中包含图像和节点文本。但这很糟糕，我希望XamDataGrid对象显示图像。

此处显示28个不同的图像，其中一些是动态创建的。所以我不想制作大量不同的模板，按文件路径加载图像，然后使用不同的模板。

XamDataTree，我也尝试使用Element name或!指定绑定。我正在尝试直接从模型或通过DataTemplate加载图像：

<ig:XamDataTree
    ScrollViewer.CanContentScroll="True"
    ItemsSource="{Binding Model}"
    HorizontalAlignment="Stretch"
    VerticalAlignment="Stretch"
    NodeLineVisibility="Visible"
    >
    <ig:XamDataTree.Resources>
        <DataTemplate x:Key="nodeImage" >
            <Image Source="{Binding Path=NodeImage}" />
        </DataTemplate>
    </ig:XamDataTree.Resources>
    <ig:XamDataTree.GlobalNodeLayouts>
        <ig:NodeLayout
            ExpandedIconTemplate="{StaticResource nodeImage}"
            CollapsedIconTemplate="{Binding NodeImage}"
            Key="Children"
            DisplayMemberPath="Name"
            TargetTypeName="Model"
            >
        </ig:NodeLayout>
    </ig:XamDataTree.GlobalNodeLayouts>
</ig:XamDataTree>

我使用的模型，图像源值设置在别处：

public class Model
{
    /// <summary>
    /// Image representing the type of node this is.
    /// </summary>
    public ImageSource NodeImage
    {
        get
        {
            return this.nodeImage;
        }
        set
        {
            this.nodeImage = value;
            this.OnPropertyChanged("NodeImage");
        }
    }

    /// <summary>
    /// Controls will bind their attributes to this event handler.
    /// </summary>
    public event PropertyChangedEventHandler PropertyChanged;

    /// <summary>
    /// Fire an event alerting listners a property changed.
    /// </summary>
    /// <param name="name">Name of the property that changed.</param>
    public void OnPropertyChanged(string name)
    {
        // Check whether a control is listening.
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }
}

编辑：我尝试将图像直接从文件加载到BitmapImage中，然后将它们存储在模型中，但是不行。当使用更高级别的调试消息时，它会在输出中发布消息，数据绑定无法找到相应的属性。所以问题很可能出在我的数据绑定中。

Answer 1

另一个解决方案是使用转换器和类型Stream作为属性NodeImage。

<强>转换器：

public class StreamToImageConverter : IValueConverter {
  public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
        var imageStream = value as System.IO.Stream;
        if (imageStream != null)) {
            System.Windows.Media.Imaging.BitmapImage image = new System.Windows.Media.Imaging.BitmapImage();
            image.SetSource(imageStream );
            return image;
        }
        else {
           return null;
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
        throw new NotImplementedException();
    }
}

<强>属性：

private Stream _imageStream;
public Stream NodeImage
{
    get
    {
        return _imageStream;
    }
    set
    {
        _imageStream= value;
        this.OnPropertyChanged("NodeImage");
    }
}

<强> XAML：

<Grid>
   <Grid.Resources>
     <local:StreamToImageConverter x:Name="imageConverter"/>
   </Grid.Resources>
   <Image Source="{Binding Path=NodeImage, Converter={StaticResource imageConverter}" />
 </Grid>

Answer 2

将您的媒体资源NodeImage更改为string，然后返回图片的路径。其余部分由Image和转换器类完成，它们将您的路径转换为ImageSource。

private string _imagePath;
public string NodeImage
{
    get
    {
        return _imagePath;
    }
    set
    {
        _imagePath = value;
        this.OnPropertyChanged("NodeImage");
    }
}

从ViewModel绑定图像

2 个答案: