2.Model

Model就是一個class，是對現實中事物的抽象，開發過程中涉及到的事物都可以抽象為Model，例如客戶，客戶的姓名、編號、電話、住址等屬性也對應了class中的Property，客戶的下訂單、付款等行為對應了class中的方法。

3. View

View很好理解，就是介面。對應WPF中的xaml介面設計。

4. ViewModel

上面說過Model抽象，那麼ViewModel就是對View的抽象。顯示的資料對應著ViewMode中的Property，執行的命令對應著ViewModel中的Command。

5.WPF中MVVM的解耦方式

二.資料繫結

首先定義NotificationObject類。目的是繫結資料屬性。這個類的作用是實現了INotifyPropertyChanged介面。WPF中類要實現這個介面，其屬性成員才具備通知UI的能力在Prism中有一個NotificationObject自動實現了這個介面，位於Microsoft.Practices.Prism.ViewModel名稱空間下。也就是說，Prism推薦ViewModel繼承這個NotificationObject類來自動實現INotifyPropertyChanged介面。

1.定義Model

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Microsoft.Practices.Prism.Commands;
using Microsoft.Practices.Prism.ViewModel;

namespace WpfMsgReport.Model
{
    //航次號Model
    class BaseCommonModel:NotificationObject
    {
        private string code;

        public string Code
        {
            get { return code; }
            set
            {
                code = value;
                this.RaisePropertyChanged("Code");
            }
        }


        private string name;

        public string Name
        {
            get { return name; }
            set
            {
                name = value;
                this.RaisePropertyChanged("Name");
            }
        }

        private string other;

        public string Other
        {
            get { return other; }
            set
            {
                other = value;
                this.RaisePropertyChanged("Other");
            }
        }
    }
}
 

2.定義ViewModel：ViewModel有屬性VoyNoList

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Microsoft.Practices.Prism.Commands;
using Microsoft.Practices.Prism.ViewModel;
using System.Windows.Forms;
using WpfMsgReport.Model;

namespace WpfMsgReport.ViewModel
{
    //主頁面ViewModel
    class MainWindowViewModel : NotificationObject
    {
        /// <summary>
        /// 航次號列表
        /// </summary>
        private List<BaseCommonModel> voyNoList;
        public List<BaseCommonModel> VoyNoList
        {
            get { return voyNoList; }
            set
            {
                voyNoList = value;
                this.RaisePropertyChanged("VoyNoList");
            }
        }

        public MainWindowViewModel(HelpNavigator MyNavigator)
        {
            //載入主介面資料
            this.loadMainData();
        }
        /// <summary>
        /// 載入主介面資料
        /// </summary>
        private void loadMainData()
        {
            //載入航次號列表
            this.VoyNoList = new List<BaseCommonModel>();
            BaseCommonModel voyNoModel = new BaseCommonModel();
            voyNoModel.Code = "10000";
            voyNoModel.Name = "10000";
            VoyNoList.Add(voyNoModel);
            BaseCommonModel voyNoModel1 = new BaseCommonModel();
            voyNoModel1.Code = "10001";
            voyNoModel1.Name = "10001";
            VoyNoList.Add(voyNoModel1);
        }
    }
}
 

3.View控制元件繫結ViewModel的屬性VoyNoList

<ComboBox x:Name="voyNoList" ItemsSource="{Binding VoyNoList}" DisplayMemberPath="Name" SelectedValuePath="Code" SelectionChanged="voyNoList_SelectionChanged"/>

xaml對應的.cs的DataContext設定為MainWindowViewModel

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using WpfMsgReport.Model;
using WpfMsgReport.ViewModel;

namespace WpfMsgReport
{
    /// <summary>
    /// MainWindow.xaml 的互動邏輯
    /// </summary>
    public partial class MainWindow : Window
    {

        System.Windows.Forms.HelpNavigator MyNavigator = System.Windows.Forms.HelpNavigator.TableOfContents;
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new MainWindowViewModel(MyNavigator);
        }
    }
    
}

三.命令繫結

1.ViewModel定義命令並繫結實現方法

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Microsoft.Practices.Prism.Commands;
using Microsoft.Practices.Prism.ViewModel;
using System.Windows.Forms;
using WpfMsgReport.Model;
using System.Windows;


namespace WpfMsgReport.ViewModel
{
    //主頁面ViewModel
    class MainWindowViewModel : NotificationObject
    {
        /// <summary>
        /// 航次號列表
        /// </summary>
        private List<BaseCommonModel> voyNoList;
        public List<BaseCommonModel> VoyNoList
        {
            get { return voyNoList; }
            set
            {
                voyNoList = value;
                this.RaisePropertyChanged("VoyNoList");
            }
        }


        ///命令
        public DelegateCommand<object> SendMailCommand { get; set; }    //傳送報文按鈕


        public MainWindowViewModel(HelpNavigator MyNavigator)
        {
            this.SendMailCommand = new DelegateCommand<object>(SendMailCommandExecute);
            //載入主介面資料
            this.loadMainData();
        }
        /// <summary>
        /// 載入主介面資料
        /// </summary>
        private void loadMainData()
        {
            //載入航次號列表
            this.VoyNoList = new List<BaseCommonModel>();
            BaseCommonModel voyNoModel = new BaseCommonModel();
            voyNoModel.Code = "10000";
            voyNoModel.Name = "10000";
            VoyNoList.Add(voyNoModel);
            BaseCommonModel voyNoModel1 = new BaseCommonModel();
            voyNoModel1.Code = "10001";
            voyNoModel1.Name = "10001";
            VoyNoList.Add(voyNoModel1);
        }


        /// <summary>
        /// 選擇報文，傳送郵件
        /// </summary>
        /// <param name="obj"></param>
        private void SendMailCommandExecute(object obj)
        {
            UIElement ui = obj as UIElement;
            if (ui != null)
            {
                if (ui.GetType().Name == "DataGrid")
                {
                    System.Windows.Controls.DataGrid dg = ui as System.Windows.Controls.DataGrid;
                    var a = dg.SelectedItem;
                    System.Windows.Forms.MessageBox.Show("傳送郵件");
                }
            }
        }


    }
}

2.在xaml的控制元件繫結命令，並把介面控制元件作引數傳遞到ViewModel的方法中

                    <Button Width="100" Cursor="Hand" Background="White" BorderBrush="White" Command="{Binding Path=SendMailCommand}" CommandParameter="{Binding ElementName=reportListDataGrid}">
                        <StackPanel Orientation="Horizontal">
                            <Image HorizontalAlignment="Center" VerticalAlignment="Center" Source="/WpfMsgReport;component/Images/email.gif" Height="16"/>
                            <TextBlock Text="傳送郵件" Width="70" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2,0,0,0" />
                        </StackPanel>
                    </Button>

3.實現效果

四.事件繫結

WPF中不是所有的控制元件都有Command屬性的，如窗體，如果需要在ViewModel中處理Loaded事件命令，或者其他事件的命令時，很難通過繫結Command完成，必須要註冊依賴屬性或事件等，太麻煩了。我喜歡簡約、有效的方式，現在我和大家一起分享一下。

場景，我需要處理ComboBox的SelectionChanged事件，但又避免用後置程式碼，儘量要在ViewModel中獲取。這是需要一個System.Windows.Interactivity.dll，該dll是安裝Blend後才有的，在C:\Program Files\Microsoft SDKs\Expression\Blend\.NETFramework\v4.0\Libraries目錄中，然後我們仍需要Prism.dll。

1.在ViewModel定義命令ChangeVoyNoCommand

2.在ViewModel實現方法ChangeVoyNoCommandExecute

3.在xaml中匯入System.Windows.Interactivity.dll

4.在控制元件ComboBox上繫結事件SelectionChanged和命令ChangeVoyNoCommand

<ComboBox x:Name="voyNoList" ItemsSource="{Binding VoyNoList,UpdateSourceTrigger=PropertyChanged}" SelectedValue="{Binding Path=SelectVoyNo, UpdateSourceTrigger=PropertyChanged}" DisplayMemberPath="Name" SelectedValuePath="Code">
<i:Interaction.Triggers>
<i:EventTrigger EventName="SelectionChanged">
<i:InvokeCommandAction Command="{Binding ChangeVoyNoCommand}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</ComboBox>

5.實現效果