WPF MVVM：從轉換器調用視圖模型中的方法

Question

我有一個WPF圖像控件，它的源屬性綁定到返回圖像的屬性。

<Image Grid.Row="0" 
     Source="{Binding Path=ImageSrc, NotifyOnTargetUpdated=True, Converter={StaticResource imgToSrcConverter}}" /> 

然後，我有一個轉換器，將圖像綁定到源屬性並將其轉換爲bitmapImage。當bitmapimage下載完成後，我想在我的視圖模型中執行一個方法，所以我訂閱了BitmapImage中的DownloadCompleted事件。那麼我怎樣才能從轉換器中調用視圖模型中的方法？它會違反MVVM原則嗎？

轉換：

public class ImgToSrcConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, 
      System.Globalization.CultureInfo culture) 
    { 
     Image image = value as Image; 
     if (image != null) 
     { 
      MemoryStream ms = new MemoryStream(); 
      image.Save(ms, image.RawFormat); 
      ms.Seek(0, SeekOrigin.Begin); 
      BitmapImage bi = new BitmapImage(); 
      bi.BeginInit(); 
      bi.StreamSource = ms; 
      bi.EndInit(); 

      bi.DownloadCompleted += new EventHandler(bi_DownloadCompleted); 

      return bi; 
     } 
     return null; 
    } 

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

    private void bi_DownloadCompleted(object sender, EventArgs e) 
    { 
     // Call my method in view model 
    } 
} 

Answer 1

你可以使用多轉換器，接受幾個值：

public class ImgToSrcConverter : IMultiValueConverter 
{ 
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) 
    { 
     Image image = values[0] as Image; 
     if (image != null) 
     { 
      MemoryStream ms = new MemoryStream(); 
      image.Save(ms, image.RawFormat); 
      ms.Seek(0, SeekOrigin.Begin); 
      BitmapImage bi = new BitmapImage(); 
      bi.BeginInit(); 
      bi.StreamSource = ms; 
      bi.EndInit(); 

      ViewModel vm = values[1] as ViewModel; 
      bi.DownloadCompleted += (s, e) => 
      { 
       vm.Method(); 
      }; 

      return bi; 
     } 
     return null; 
    } 

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

用法：

<Image Grid.Row="0"> 
    <Image.Source> 
     <MultiBinding NotifyOnTargetUpdated="True" Converter="{StaticResource imgToSrcConverter}"> 
      <Binding Path="ImageSrc" /> 
      <Binding Path="." /> 
     </MultiBinding> 
    </Image.Source> 
</Image> 

不，這不，只要打破MVVM模式您的可測試應用程序邏輯保留在視圖模型中。

Answer 2

你可以做的是通過直接的DataContext到轉換器，然後從那裏訪問適用屬性/方法。

更新圖像XAML到：

<Image Grid.Row="0" 
     Source="{Binding Path=DataContext, 
         RelativeSource={RelativeSource Self}, 
         NotifyOnTargetUpdated=True, 
         Converter={StaticResource imgToSrcConverter}}" /> 

然後，握住你的視圖模型的引用，並據此稱：

public class ImgToSrcConverter : IValueConverter 
{ 
    private MyViewModel _dataContext; 

    public object Convert(object value, Type targetType, object parameter, 
      System.Globalization.CultureInfo culture) 
    { 
     var dataContext = value as MyViewModel; 
     if (dataContext != null) 
     { 
      _dataContext = dataContext; 

      var image = dataContext.ImageSrc as Image; 
      if (image != null) 
      { 
       MemoryStream ms = new MemoryStream(); 
       image.Save(ms, image.RawFormat); 
       ms.Seek(0, SeekOrigin.Begin); 
       BitmapImage bi = new BitmapImage(); 
       bi.BeginInit(); 
       bi.StreamSource = ms; 
       bi.EndInit(); 

       bi.DownloadCompleted += new EventHandler(bi_DownloadCompleted); 

       return bi; 
      } 
     } 
     return null; 
    } 

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

    private void bi_DownloadCompleted(object sender, EventArgs e) 
    { 
     _dataContext?.MyMethod(); 
    } 
}   

注意，我覺得這是一個有點代碼 - 的對於MVVM而言，通常情況下，您絕不會希望通過轉換器訪問您的ViewModel。對我來說，似乎這些邏輯可以在ViewModel本身中加載/維護，而不依賴於轉換器。

Answer 3

使用IMultiValueConverter即使世界的方法，所以你可以得到你的形象和DataContext的（vievmodel）的轉換器... WPF: MultiBinding and IMultiValueConverter

另一種方式可能是一個EventAggregator/MessageBus，然後將消息發送到您的視圖模型。 ..？儘管許多人會認爲MessageBus可以被視爲反模式。 Roll Your Own Simple Message Bus/Event Aggregator