WPF MVVM模式下如何正确设置Image控件Source为空且无警告报错

警告出现的根本原因是Image控件的Source属性原生类型为ImageSource，你绑定string类型属性时，WPF会调用默认的ImageSourceConverter做类型转换，而该转换器不支持null或无效字符串作为输入，因此抛出转换警告。

方案1：使用IValueConverter处理转换（最符合MVVM的通用方案） #

自定义转换器处理空值、无效路径的场景，彻底避免默认转换器抛出警告，还可以扩展支持默认占位图需求。

转换器代码 #

using System;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using System.Windows.Media.Imaging;

public class StringToImageSourceConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        string path = value as string;
        // 空路径直接返回无有效值标记，不会触发警告
        if (string.IsNullOrWhiteSpace(path)) return DependencyProperty.UnsetValue;
        
        try
        {
            return new BitmapImage(new Uri(path, UriKind.RelativeOrAbsolute));
        }
        catch
        {
            // 无效路径同样返回无有效值标记
            return DependencyProperty.UnsetValue;
            // 如果需要显示默认占位图，可替换为以下代码
            // return new BitmapImage(new Uri("pack://application:,,,/Images/Placeholder.png"));
        }
    }

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

XAML使用方法 #

首先在页面资源中注册转换器：

<Window.Resources>
    <local:StringToImageSourceConverter x:Key="ImageConverter"/>
</Window.Resources>

修改Image的绑定配置：

<Image Source="{Binding PieceImage, Converter={StaticResource ImageConverter}}" />

后续需要无图效果时，直接把PieceImage设为null或空字符串即可。

方案2：使用TargetNullValue快速处理空值场景 #

如果只需要处理PieceImage为null的场景，不需要兼容无效路径，不需要编写转换器，直接修改绑定配置即可：

<Image Source="{Binding PieceImage, TargetNullValue={x:Null}}" />

该配置下源为null时会直接给Source属性赋值null，不会走默认转换器逻辑，因此不会触发警告。

方案3：修改ViewModel属性类型为ImageSource #

直接将属性类型修改为Source原生匹配的ImageSource类型，不需要类型转换自然不会触发转换警告：

ViewModel代码 #

private System.Windows.Media.ImageSource pieceImage;
public System.Windows.Media.ImageSource PieceImage
{
    get => this.pieceImage;
    set => this.SetProperty(ref this.pieceImage, value);
}

赋值逻辑 #

// 有图场景
this.PieceImage = new BitmapImage(new Uri("../Images/King.png", UriKind.Relative));
// 无图场景
this.PieceImage = null;

内容的提问来源于stack exchange，提问作者AidanH