使用 Xamarin.Forms 中的转换器替换图像

Question

我正在尝试根据在Xamarin.Forms 中使用Converters 的数据下载动态更改Image 源

从服务器获取数据共有三种状态

1) 数据下载成功时成功 2) 数据未下载出现错误时报错 3) 进程空闲时

对于上述所有情况，我使用不同的图标。

这是我的 XAML 代码

 <Image Source="{Binding CustomerState,  Converter={StaticResource SyncConverter}}"  HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" Grid.Column="0" HeightRequest="20" Margin="8,12,8,12" />

这是我的转换器代码

public class SyncConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            bool? syncState = value as bool?;

            if (syncState != null) { 
                if (syncState.Value) return "ic_success";
                else return "ic_error";
            }

          return "ic_idle";
        }

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

在上述代码中，如果CustomeState 为空，则显示ic_idle 图标，如果CuswtomerStat 为真，则显示成功，否则显示错误。

我的视图模型代码

private bool? isCustomerState;

public bool? CustomerState
        {
            get { return isCustomerState; }
            set
            {
                isCustomerState = value;
                OnPropertyChanged("CustomerState");


            }
        }

但不知何故，xamarin 在get { return isCustomerState; } 处抛出错误，错误是

System.NullReferenceException：对象引用未设置为实例 一个对象。

Answer 1

您可以在使用前尝试验证“价值”。类似的东西

public class SyncConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {

          if(value != null){
            bool? syncState = value as bool?;

            if (syncState != null) { 
                if (syncState.Value) return "ic_success";
                else return "ic_error";
            }
           }
          return "ic_idle";
        }

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

Answer 2

更新： 正如 Alessandro 在 cmets 中提到的 - 在这种情况下，转换器提供的实例的返回类型可能不是实际问题。 ImageSourceConverter 应该处理从字符串到 ImageSource 的转换。

由于您绑定到 Image 上的 Source 属性，该属性的类型为 ImageSource - 所以您的转换器还应该返回 ImageSource 类型的实例。

public class SyncConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {

      if(value != null){
        bool? syncState = value as bool?;

        if (syncState != null) { 
            if (syncState.Value) return ConvertToImageSource("ic_success");
            else return ConvertToImageSource("ic_error");
        }
       }
      return ConvertToImageSource("ic_idle");
    }

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

    private ImageSource ConvertToImageSource(string fileName)
    {
         return Device.OnPlatform(
              iOS: ImageSource.FromFile($"Images/{fileName}"),
              Android:  ImageSource.FromFile(fileName),
              WinPhone: ImageSource.FromFile($"Images/{fileName}"));
    }
}

您可以在此处找到更多详细信息： https://developer.xamarin.com/guides/xamarin-forms/user-interface/images/#Image_and_ImageSource

Answer 3

  public class SyncConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter,
            System.Globalization.CultureInfo culture)
        {
            if (targetType != typeof(bool))
                return ConvertToImageSource("ic_idle"); 

            return (bool)value? ConvertToImageSource("ic_success"): ConvertToImageSource("ic_error");
        }

        public object ConvertBack(object value, Type targetType, object parameter,
            System.Globalization.CultureInfo culture)
        {
            return (bool)value;
        }
    }