WPF(MVVM)で、Taskを使った別スレッドからビットマップイメージが表示できません。

Question

こんにちは。
Windows10でVisual Studio 2017 Proを使って開発しています。

C# WPF(MVVM)で別スレッドからビットマップイメージを表示する際に問題が
発生しているため、お力添えをお願いします。

前提・実現したいこと

C# WPFで、MVVMの構成でTaskを使った別スレッドから受け取ったビットマップイメージを"1枚ずつ"表示したいです。

C#のWPF、MVVMの構成で、外部(PCとUSB接続している機械)から受信したビットマップイメージを表示しようとしています。
受信するビットマップイメージは複数枚(枚数は毎回違う)で、受信タイミングも不定期です。
データが複数枚且つ不定期受信であること、USB通信や受信データのチェック処理を行うこと、受信に成功したデータを
順次表示するため、Task.Runを使用してViewModelからModelのメソッドを呼び出すことで、別スレッドで処理しています。
1度の操作で複数枚のイメージデータを表示するため、受信したデータはデリゲートと使ってModelからViewModelへ渡し
ViewModelのでウィンドウのコントロールにバインドすることで表示しようとしています。

処理のイメージは以下通りです。

1.ボタンクリック
　↓
2.ViewModelからModelのビットマップイメージ受信メソッドを呼び出す
  (ここでTask.Runを使用して別スレッド化)
　↓
3.ModelからUSB通信処理を呼び出す
　↓
4.USB通信でビットマップイメージデータを受信
　↓
5.Modelへデリゲートで受信したデータを渡す
　↓
6.USB通信処理から受け取ったデータをファイル出力
　↓
7.ModelからViewModelへデリゲートで受信したデータを渡す
　↓
8.Modelから受け取ったビットマップイメージデータをコントロールにバインドして表示
  (ビットマップイメージのコントロールは1つのため、以降データを上書いていく)
　↓
4～8をデータを受信し終えるまで繰り返す
　↓
9.データ受信を終えたら処理をViewModelへ戻す

発生している問題

1枚分のビットマップイメージを受信して表示すること、一定間隔(3秒以上)で受信して表示することには
成功しているのですが、受信間隔が短い(3秒未満)場合に2枚目以降のビットマップイメージが表示されません。
表示されない状態というのは、1枚目のビットマップイメージが消え、ビットマップイメージ表示領域が
白背景の状態です。

エラーメッセージの表示やアプリケーションが落ちることはなく、2枚目以降が表示さず動き続けています。
上記、「前提・実現したいこと」に記載の処理イメージの6.に記載しているファイル出力は正常に行われており、
出力したファイルのデータは、別のビットマップイメージを表示するツールで確認すると問題なく表示できます。
おそらく、ViewModelでビットマップイメージをコントロールにバインドしている処理あたりが原因かとおもうのですが、
なぜ2枚目以降が表示されないのか原因が分かりません。

該当のソースコード

以下、実際のソースコードから問題に関連する箇所のみを掲載しています。

Window.xaml(View)

<!-- ImageタグのSourceにビットマップイメージデータをバインドする -->
<Image Source="{Binding BitmapImageData}" Stretch="Uniform"/>

<!-- データ受信実行ボタンは省略 -->

Window.xaml.xs

private ViewModel m_viewModel;　　  // ViewModelクラス
public Window()
{
   InitializeComponent();

   m_viewModel = new ViewModel();
   DataContext = m_viewModel;
}

ViewModelBase(ViewModelの基底クラス)

// ViewModelのプロパティにセットされたデータをViewへ反映する
public abstract class ViewModelBase : INotifyPropertyChanged, INotifyDataErrorInfo
{
   ~ViewModelBase()
   {
      ClearResource();
   }

   private bool _isCrlResource = false;

   protected virtual void ClearResource()
   {
      if (_isCrlResource) return;

      if (PropertyChanged != null)
      {
         foreach (var handler in PropertyChanged.GetInvocationList())
         {
            PropertyChanged -= (PropertyChangedEventHandler)handler;
         }
      }

      PropertyChanged = null;
      _isCrlResource = true;
   }

   /// <summary>
   /// INotifyPropertyChanged.PropertyChanged の実装。
   /// INotifyPropertyChanged.PropertyChanged implement.
   /// </summary>
   public event PropertyChangedEventHandler PropertyChanged;

   /// <summary>
   /// INotifyPropertyChanged.PropertyChangedイベントを発生させる。
   /// INotifyPropertyChanged.PropertyChanged event is generated.
   /// </summary>
   protected virtual bool SetProperty<T>(ref T storage, T value, [CallerMemberName] String propertyName = null)
   {
      if (object.Equals(storage, value)) return false;

      storage = value;

      if (PropertyChanged != null)
      {
         PropertyChanged.Invoke(this, new PropertyChangedEventArgs(propertyName));
      }
      else
      {
         PropertyChanged = null;
      }

      return true;
   }
}

WindowViewModel.cs(ViewModel)

// ViewModelBase->INotifyPropertyChanged等を実装した基底クラス
public class WindowViewModel : ViewModelBase 
{
   private WindowModel m_model;  // Modelクラス

   private BitmapImage _bitmapImageData;
   // 受信したビットマップイメージをバインドするプロパティ
   public BitmapImage BitmapImageData
   {
      get { return _bitmapImageData; }
      set { SetProperty(ref _bitmapImageData, value); }
   }

   public WindowViewModel()
   {
      m_model = new WindowModel();
      m_model.SetDelegateFunc(DisplayBitmapImage);
      BitmapImageData = null;
   }

   private async void ReadBitmapImage()
   {
      // ボタングレーアウト処理

      await Task.Run(() => m_model.ReadBitmapImageData());

      // ボタングレーアウト解除処理
   }

   // Modelからビットマップイメージを受け取るデリゲート
   private void DisplayBitmapImage(byte[] bitmapData)
   {
      BitmapImage bitmapImg = null;
      try
      {
         using (var memStream = new System.IO.MemoryStream(bitmapData))
         {
         bitmapImg = new BitmapImage();
         bitmapImg.BeginInit();
         bitmapImg.CacheOption = BitmapCacheOption.OnLoad;
         bitmapImg.StreamSource = memStream;
         bitmapImg.EndInit();
         bitmapImg.Freeze();
         }
      }
      catch (Exception)
      {
         // エラー処理
         bitmapImg = null;
      }

      BitmapImageData = bitmapImg;  // ビットマップコントロールにデータをセット
   }
}

WindowModel.cs(Model)

public class WindowModel()
{
   private Action<byte[]> m_displayBitmap;  // ViewModelのビットマップイメージ表示メソッド
   private byte[] m_bitmapData;             // ビットマップイメージデータ

   public WindowModel()
   {
      m_displayBitmap = null;
      m_bitmapData = null;
   }

   public void ReadBitmapImageData()
   {
      USBComm.SetDelegateFunc(DisplayBitmapImage);  // イメージデータを取得するためのデリゲート設定
      USBComm.ReadImageData();                      // イメージデータ取得
   }

   // USB通信処理クラスからビットマップイメージを受け取るデリゲート
   private void DisplayBitmapImage(uint dataSize, bool dataErrFlag)
   {
      // 受信したデータに異常がない場合のみDLLから取得する
      if (dataErrFlag == false)
      {
         byte[] buff = new byte[dataSize];
         USBComm.GetReceiveData(ref buff);
         
         m_bitmapData = bitmapData;      // 意味ないと思うが念のためメンバにセット
         m_displayBitmap(m_bitmapData);  // Viewのビットマップイメージ表示メソッド呼び出し
         m_bitmapData = null;
      }

      USBComm.ClearReceiveData();        // DLL内のデータをクリア
   }
}

USBComm.cs(USB通信処理DLLインターフェイス)

public static class USBComm
{
   /// <summary>
   /// DLL内で取得したイメージデータのサイズとエラー情報を取得するデリゲート
   /// </summary>
   /// <param name="dataSize">イメージデータサイズ</param>
   /// <param name="errFlag">データエラーフラグ : 0 = Not error / !0 = Error</param>
   public delegate void DelegateDisplayBitmapImage(uint dataSize, byte errFlag);

   static DelegateDisplayBitmapImage m_delegateFunc;

   // イメージデータ取得用デリゲートメソッドのセット
   [DllImport("USBComm.dll", EntryPoint = "SetDelegateFunc", CallingConvention = CallingConvention.StdCall)]
   private static extern void DllSetDelegateFunc(DelegateDisplayBitmapImage  func);
   // イメージデータ受信
   [DllImport("USBComm.dll", EntryPoint = "ReadImageData", CallingConvention = CallingConvention.StdCall)]
   private static extern void DllReadImageData();
   // 受信データ取得
   [DllImport("USBComm.dll", EntryPoint = "GetReceiveData", CallingConvention = CallingConvention.StdCall)]
   private static extern void DllGetReceiveData(IntPtr iPtr);
   // 受信データクリア
   [DllImport("USBComm.dll", EntryPoint = "ClearReceiveData", CallingConvention = CallingConvention.StdCall)]
   private static extern void DllClearReceiveData();

   public static void SetDelegateFunc(DelegateDisplayBitmapImage  func)
   {
      m_delegateFunc = func;
      DllSetDelegateFunc(m_delegateFunc );
   }

   public static void ReadImageData() => DllReadImageData();
   
   public static void GetReceiveData(ref byte[] buff)
   {
      // 取得するデータサイズ分IntPtrのメモリ領域を確保
      IntPtr ptr = Marshal.AllocHGlobal(buff.Length);
      // DLLからデータを取得
      DllGetReceiveData(ptr);
      // DLLから取得したデータをコピー
      Marshal.Copy(iPtr, buff, 0, buff.Length);
      // IntPtrのメモリ解放
      Marshal.FreeHGlobal(ptr);
   }
   
   public static void ClearReceiveData() => DllClearReceiveData;
}

USBCommクラスで参照しているDLL(USBComm.dll)はC++で実装しています。
DLLのソースコードは、セキュリティの問題で掲載できません。
同じDLLを使用したC++ MFCのツールが存在し、そちらで同じように複数枚のイメージデータを
非同期処理で受信→表示することができています。

確認したこと

Taskを使用した別スレッドでUIスレッド外からのアクセスのため、表示ができない
(1枚目や一定間隔はできているが)のかと思いネットで情報を探してみたのですが、
MVVMでバインディングを介してウィンドウを更新する場合は問題ないという内容が
いくつか見つかりました。
ビットマップイメージを表示するための"Imageタグ"のプロパティにデータがセット
されていることはデバッグで確認しているのですが、先に表示されていたイメージが
消え白背景に更新されてしまいます。
そのため、現状何が原因か分からず、手詰まりの状態です。

補足情報（FW/ツールのバージョンなど）

開発環境
Windows 10 Pro
Microsoft Visual Studio Prodessional 2017 Version 15.9.15
.NET Framework Version 4.8.03752
ターゲットフレームワーク 4.5
言語バージョン C# 6

Comments

[ebiryo]

「4～8をデータを受信し終えるまで繰り返す」とありますが、繰り返しを実行している箇所のソースはありますか？

[heero]

ご確認頂きありがとうございます。

繰り返しは以下のメソッドを順に実行しています。
4.USB通信でビットマップイメージデータを受信
→ModelクラスのReadBitmapImageDataメソッドでDLLのReadImageData関数を呼び出す。

5.Modelへデリゲートで受信したデータを渡す
→DLLからModelクラスのDisplayBitmapImageメソッドが呼び出される。

6.USB通信処理から受け取ったデータをファイル出力
→ModelクラスのDisplayBitmapImageメソッドが引数に指定されたサイズ分
　byte配列を確保し、DLLのGetReceiveData関数を使って受信データを取得しファイル出力。

7.ModelからViewModelへデリゲートで受信したデータを渡す
→DLLから取得したデータをViewModelクラスのDisplayBitmapImageメソッドを呼び出して
　ViewModelへ渡す。

8.Modelから受け取ったビットマップイメージデータをコントロールにバインドして表示
(ビットマップイメージのコントロールは1つのため、以降データを上書いていく)
→ViewModelクラスのDisplayBitmapImageメソッドは受け取ったデータをバインドして終了。
　(処理がModelクラスのDisplayBitmapImageメソッドへ戻る。)

USB通信を行うDLLのソースコード(ReadImageData関数のソース)はセキュリティの関係上
掲載できませんので、ご了承ください。
DLL内の処理の簡単な説明としては、受信データのフォーマットチェック後、上位(App)から
セットされたコールバック関数の引数に受信データサイズとフォーマットチェック結果を
指定して呼び出し、コールバック関数(ModelクラスのDisplayBitmapImageメソッド)から
処理が返ってきたら、またデータ受信を行うといった流れです。

下手な文章での説明となってしまい申し訳ございません。
ご尽力、よろしくお願い致します。

[hihijiji]

View側の問題なのかModel側の問題なのか切り分ける必要があります。
Viewを確認するには別途、BitmapImageDataを更新するModelを書いてください。

[heero]

ご確認頂きありがとうございます。

ViewのImageタグへデータをバインドする際に変更を通知しているViewModelの
基底クラス、"ViewModelBase"のソースコードを追加致しました。
ViewModelではBitmapImageDataをBitmapImageでプロパティ宣言し、
setメソッド内でViewModelBaseクラスの"SetPropertyメソッド"を
呼び出すことで、データ変更を通知しています。
データ変更は、ViewModelクラスの"DisplayBitmapImageメソッド"の
最後の行、「BitmapImageData = bitmapImg;」で行っています。

記載内容やソースの不備がございましたら、ご指摘お願い致します。

[ebiryo]

念のため確認なのですが、WindowViewModel のDisplayBitmapImage自体は複数回呼ばれていて、
BitmapImageData に新しいBitmapがセットされているのに、表示されないということですよね？

[heero]

ebiryoさん
仰る通りです。デバッグで確認した際は、DisplayBitmapImageがModelから呼び出され、
BitmapImageData にBitmapデータがセットされています。
リリースビルドでは、DisplayBitmapImageが呼び出されることを確認するため、
テキストボックスを用意してそこに文字を表示する形で確認しましたが、問題ありませんでした。

[ebiryo]

Modelから呼び出されたDisplayBitmapImageのところで画像をファイルに落として確認してみてはいかがでしょうか。
呼び出されていることが確認ずみなら、３回呼ばれたらVMのDisplayBitmapImageで３ファイル生成されますよね？その内容を確認してみてはいかがでしょうか。
Modelから渡されたデータが同じものである可能性も否定できない気がするのですが。

[heero]

ebiryoさん
コメントありがとうございます。DisplayBitmapImageメソッドでのファイル出力、確認してみます。

"表示されない"状態というのが、表示されていた1枚目のイメージが消えて何も表示されない(白背景)状態に
なってしまいます。"2回目以降が表示されない"の"表示されない"という状態についての説明が足りないため
誤解を招いてしまったみたいです。
質問内容の「発生している問題」と「確認したこと」に同様の詳細を明記致しました。

[退会済みユーザー]

非同期処理をお使いとのことですが、スレッドセーフとか排他制御とか大丈夫です？
メソッドはきちんと想定通りの順番で呼び出されているか、ログに出力したりして確認しました？

[heero]

radianさん

コメントありがとうございます。
Taskのため、指定したメソッド内で起きた例外はtry-catchで拾うようにしています。
ログに出力して確認はしていませんが、デバッグ実行でブレークを張って呼び出し順は
確認しています。

[退会済みユーザー]

うーん、言ってる事が伝わってないかな？例外の話では無いです。
> 受信するビットマップイメージは複数枚(枚数は毎回違う)で、受信タイミングも不定期です。
と記述されていて、間隔が短い場合に問題が発生しているということは、不完全なデータを受け取ったり、同時に実行されてはまずい処理が同時に動いている＝排他制御出来てないのではということです。
ブレークポイントでのチェックは、十分な時間的余裕が与えられてしまうので、間隔が短い状況の再現は出来なくないです？面倒くさがらずにログに出しましょう。受信したバイトデータの出力→受信でのビットマップのハッシュ値を取ったりして、データが化けてないかもチェックしましょう。

Answer 1

MVVMがスレッドフリーかどうかは知らないですが、VMクラスのロジックをスレッドフリーで設計する必要があり、破綻してもおかしくないと思います。

Model部でTaskを大量に非同期実行して、VM部で結果をListViewに表示するプログラムを作ったことがあるので実現方法を紹介します。

Model部の各タスクから通知を受けたときに、データをVM部で持っているキューに保存します。この関数のみマルチスレッドで動きます。
それとは別に、VMで定期実行しているタイマーハンドラーで、キューを取り出してUIに反映させます。
こうすることで、スレッドフリーの関数を1つに集約しつつ、UIへの表示タイミングはVM部で調整できます。

キューにはスレッドフリーの ConcurrentQueueを使用することで、queueの出し入れに排他ロックは不要になります。

以下、VM部のソース抜粋します

private ConcurrentQueue<Node> queue;

// この関数はModelのスレッドからコールされる。
// マルチスレッドからコールされるので、スレッドフリーの設計が必要
public void fromModel(Node n)
{
     this.queue.Enqueue(n);   // VMのキューに保存
};

// VMの定期実行タイマーより起動
private void OnTimer()
{
    bool f = false;
    while (this.queue.TryDequeue(out Node n))
    {
        this.list.Add(new NodeView(n));     // ListViewに登録
        f = true;
    }
    if(f)
    {
        base.RaisePropertyChanged("List");   // Viewに更新通知
    }
}