WINFROM MVVM

網上看到WINFROM 也能MVVM，沒做研究，摘抄一下，備用

1、引言

  談到MVVM設計模式，首先讓人想到的是WPF。沒錯，MVVM的概念是微軟在2005年提出的，並首次將其應用到WPF中。最近很是火的Vue.js也是使用了MVVM的設計模式。MVVM設計模式的核心部分是DataBinding機制。顧名思義，其功能就是將Model的數據綁定到View層，而且將View層控件的變換綁定到Model的雙向綁定。MVVM的優勢是業務邏輯層不用關注View，只專一對Model的處理，開發效率提高很大。 react

2、背景

  最近公司在開發一套管理系統的桌面客戶端程序，因為各類緣由，最終選型使用WinForm進行開發。因為好幾年沒有再接觸過WinForm了，起初一段時間很是的不適應，開發效率極低，不只要考慮不一樣分辨率的適應狀況（這里稍微吐槽一下：WinForm自己就難以處理不一樣分辨率的自適應），同時還要處理數據的顯示及提交。
  既然要提高開發效率，咱們先從設計模式下手。今天要為你們帶來的是ReactiveUI。
  ReactiveUI是實現了MVVM模式的框架，它的核心目標是能夠在ViewModel中相關屬性發生變化時能夠可執行相應的命令。ReactiveUI支持Xamarin、WPF、WinForm、Windows Phone、UWP。這里咱們選擇WinForm對應的版本ReactiveUI.WinForms。web

3、示例

  下面為你們帶來ReactiveUI.WinForms的一個簡單的示例，來一塊兒認識ReactiveUI.WinForms。設計模式

一、建立WinForm項目

打開vs，咱們建立一個WinForm的項目：
框架

二、安裝ReactiveUI.WinForms

項目建立完成后，鼠標右鍵單擊當前項目，選擇“管理NuGet程序包”，在打開的窗口中選擇“瀏覽”，並搜索ReactiveUI.WinForms進行安裝
svg

三、建立ViewModel

在項目目錄下新建文件夾ViewModel，並在文件夾下新建一個PersonViewModel類，寫入以下代碼：函數

using ReactiveUI;

namespace WinformMvvm.ViewModel { //ViewModel須要繼承自ReactiveObject public class PersonViewModel : ReactiveObject { private int _id; private string _name; private int _age; public PersonViewModel() { Id = 1; Name = "張三"; Age = 18; } public int Id { get => _id; set => this.RaiseAndSetIfChanged(ref _id, value); } public string Name { get => _name; set => this.RaiseAndSetIfChanged(ref _name, value); } public int Age { get => _age; set => this.RaiseAndSetIfChanged(ref _age, value); } } }

• 注意：ViewModel類須要繼承自ReactiveObject

四、給窗體拖入相應的控件並修改相關代碼

在項目默認的Form1窗體上拖入3個textbox和3個label控件
右鍵單擊Form1窗體，選擇“查看代碼”，進入代碼窗口，寫入以下代碼：ui

using ReactiveUI; using System.Windows.Forms; using WinformMvvm.ViewModel; namespace WinformMvvm { //視圖窗體須要實現IViewFor接口，並以須要綁定的ViewModel類(本例中的ViewModel是PersonViewModel)做為泛型傳入接口 public partial class Form1 : Form, IViewFor<PersonViewModel> { public Form1() { InitializeComponent(); this.WhenActivated(a => { a(this.Bind(ViewModel, vm => vm.Id, v => v.textBox1.Text)); a(this.Bind(ViewModel, vm => vm.Name, v => v.textBox2.Text)); a(this.Bind(ViewModel, vm => vm.Age, v => v.textBox3.Text)); a(this.OneWayBind(ViewModel, vm => vm.Id, v => v.label1.Text)); a(this.OneWayBind(ViewModel, vm => vm.Name, v => v.label2.Text)); a(this.OneWayBind(ViewModel, vm => vm.Age, v => v.label3.Text)); }); ViewModel = new PersonViewModel(); } object IViewFor.ViewModel { get => ViewModel; set => ViewModel = (PersonViewModel)value; } public PersonViewModel ViewModel { get; set; } } }

• 注意：視圖窗體須要實現IViewFor接口，並以須要綁定的ViewModel類(本例中的ViewModel是PersonViewModel)做為泛型傳入接口

• Form1構造函數中WhenActivated里的代碼即為綁定相關。this.Bind表示雙向綁定，this.OneWayBind表示單向綁定。3個textBox分別雙向綁定ViewModel對應的屬性字段用做顯示及輸入更新，3個label分別單向綁定ViewModel對應的屬性字段用作顯示。this

  下圖即為整個示例項目的結構：
  編碼

五、運行項目

至此，項目的編碼已經完成，咱們來運行當前項目，查看效果。

能夠看到，因為ReactiveUI中MVVM的實現，咱們在修改textBox中的內容時，ViewModel中相應的屬性也會跟着改變，並將改變反應在textBox和label中。spa

4、總結

以上即是運用ReactiveUI框架使用MVVM模式開發WinForm的一個簡單示例。但願本文能為想要在WinForm下使用MVVM模式進行開發的童鞋們提供幫助。