ReactiveProperty + Prism で、V <=> VM <=> M を相互連携するアプリのサンプルコードを書いておきます。

ゴール

  • Model で設定した値が、View のテキストボックスに表示される
  • View のテキストボックスで入力した値が、Model に反映される

Model

テキストを保持するReactivePropertySlim<string型プロパティを用意します。バリデーションはいらないのでReactivePropertyよりも動作が軽いこちらを使います。

1
2
3
4
5
6
7
8
9
public class Model: BindableBase
{
    public ReactivePropertySlim<string> Text { get; set; }

    public Model()
    {
        Text = new ReactivePropertySlim<string>();
    }
}

ViewModel

View（画面）のテキストボックスと Model で保持している値を紐付けます。

1
2
3
4
5
6
7
8
9
10
11
public class ViewAViewModel : BindableBase
{
    public ReactiveProperty<string> Text { get; }

    public ViewAViewModel(Models.Model model)
    {
        Text = model
            // ViewとModelの値を双方向で紐付ける
            .ToReactivePropertyAsSynchronized(m => m.Text.Value);
    }
}

View

ViewModel のプロパティを Binding します。ViewModel のテキストを表示、画面で入力したテキストを ViewModel に反映することができます。

1
2
<!-- .Valueを忘れずに！ -->
<TextBox Text="{Binding Text.Value}" Width="200" Height="50" />

メモリリーク対策

メモリリークを防止するため、ViewModel、Model では ReactiveProperty 関連のプロパティは Dispose を実装するとよいらしいです。

1
2
3
4
5
6
7
8
9
10
11
private System.Reactive.Disposables.CompositeDisposable disposables = new System.Reactive.Disposables.CompositeDisposable();
public void Dispose()
{
    disposables.Dispose();
}

// .AddTo()を付けることで、Disposeする際に破棄される
Text = model
    .ToReactivePropertyAsSynchronized(m => m.Text.Value)
    .AddTo(disposables);