MVVM開發模式MVVM Light Toolkit

MVVM模式就不細說了

個人理解

M是Model，是業務實體model，包含了數據的存取訪問

V是View，是頁面，是展示，是數據的顯示，應該是單純的xaml代碼

VM是ViewModel，他應該是View上數據，方法，事件的抽象集合，是溝通Model和View的橋梁

 

一。 MVVM Light Toolkit安裝

目前GalaSoft的 MVVM Light Toolkit這個插件在mvvm開發方面應用比較廣泛

http://www.galasoft.ch/mvvm/

安裝地址

http://www.galasoft.ch/mvvm/installing/

目前正式版本是V3.0

 

二。新建mvvm項目

下載安裝以后，vs2010，就自動安裝了mvvm的項目模板，在window phone項目下面就可以找到適用於window phone開發的mvv項目模板

新建項目以后，mvvm基本架構就全部已經在項目中包含了

有Model文件夾，viewmodel文件夾，xaml就是View

 

有幾個文件和代碼段要注意。

ViewModelLocator這是一個核心類，這個類返回實例化的ViewModel到View。

//返回MainViewMode實例 
public MainViewModel Main
        {
            get
            {

                return MainStatic;
            }
        }

Loator的定義在App.xaml中，在app.xaml中聲明可以全局使用

     <vm:ViewModelLocator x:Key="Locator"
                             d:IsDataSource="True" />
    </Application.Resources>

 

 

 

在MainPage.xaml文件中有幾個顯示文字title的地方

<StackPanel x:Name="TitlePanel"
                    Grid.Row="0"
                    Margin="24,24,0,12">
            <TextBlock x:Name="ApplicationTitle"
                       Text="{Binding ApplicationTitle}"
                       Style="{StaticResource PhoneTextNormalStyle}" />
            <TextBlock x:Name="PageTitle"
                       Text="{Binding PageName}"
                       Margin="-3,-8,0,0"
                       Style="{StaticResource PhoneTextTitle1Style}" />
        </StackPanel>

其中Bindind中 ApplicationTitle，PageName都是ViewModel 文件夾中MainViewModel中的屬性

MainViewModel 和MainPage.xaml是通過這個代碼段綁定到一起的。

在MainPage.xaml的根元素上聲明

 DataContext="{Binding Main, Source={StaticResource Locator}}

 

三。新建頁面

參照MainPage頁面，新建頁面的時候也是新建一個ViewModel，一個View.xaml，並且在ViewModelLocator.cs中多注冊一個返回View的屬性方法綁定到xaml中就可以

新建viewmodel和view的時候也會看到mvvm安裝后產生的新模板，可以直接使用

ublic class MvvmViewModel1 : ViewModelBase
    {
        /// <summary>
        /// Initializes a new instance of the MvvmViewModel1 class.
        /// </summary>
        public MvvmViewModel1()
        {
            ////if (IsInDesignMode)
            ////{
            ////    // Code runs in Blend --> create design time data.
            ////}
            ////else
            ////{
            ////    // Code runs "for real": Connect to service, etc...
            ////}
        }

        public string Hello
        {
            get
            {
                return "Hello World!~";
            }
        }

        ////public override void Cleanup()
        ////{
        ////    // Clean own resources if needed

        ////    base.Cleanup();
        ////}
    }

在ViewModelLocator.cs中注冊這個viewmodel

可以參考模仿原來的Main的屬性

或者直接使用代碼段Code Snippets

安裝過mvvm后在安裝的文件夾位置可以找到代碼段，在vs的工具中--代碼段管理器，導入這些

然后在 拼寫 mvvmlocatorproperty 的時候就可以看到自動生成的屬性，然后把屬性名字改成正確的viewmodel名字就可以