這是我第一篇關于設計模式方面的文章，以前除了對單例模式等幾個常用的模式有所研究之外，對設計模式不是太重視，總覺得要到一定的程度才需要接觸，最近的項目中使用了MVVM模式，是以這段時間查閱了大量這方面模式的文章，理論上的東西大家都說的比較好，這裡我也不大談MVVM模式的優勢了，隻是美中不足的是大部分給出的示例中，對于一個沒有用過MVVM模式的人而言，這些例子總是給人一種摸不着頭緒的感覺，是以我想将我學習MVVM的過程一步步寫下來，希望對于和我一樣，剛剛接觸MVVM這個模式的人有一點點幫助。
如果你不知道MVVM模式，我建議你先了解一下MVVM模式，至少要知道實作該模式的意圖是什麼。
那麼我主要通過我認為是已經算是比較簡單的例子進行講解這個模式，當然後面我們會在這個例子的基礎上一步一步的進行擴充。
先來看一看我們的項目架構：
很典型的MVVM的分層方式
我們先來建構Model，首先在Person.cs中簡單聲明了一個類型
public class Person
{
public int age { get; set; }
public string name { get； set;}
}
類型定義好後，我們在Persons.cs中得到一個Person的集合
public class Persons
{
public List<Person> person;
public List<Person> getPerson()
{
person = new List<Person>()
{
new Person{name = "Tom", age = 21 },
new Person{name = "Jack", age = 22 },
new Person{name = "Rose", age = 23 },
};
return person;
}
}
那麼這裡我們就簡單的完成了Model的工作，下面開始完成ViewModel部分的工作
public class PageViewModel
{
public List<Person> Human { get; set; }
public PageViewModel()
Human = new Persons().getPerson();
}
}
ViewModel也設計的很簡單，隻是簡單的擷取了之前定義的集合。
下面就是PageView部分了，這裡用DataGrid進行顯示資料
<data:DataGrid AutoGenerateColumns="False" Height="200" ItemsSource="{Binding Path=Human}" HorizontalAlignment="Left" Margin="36,51,0,0" Name="dataGrid1" VerticalAlignment="Top" Width="200">
<data:DataGrid.Columns>
<data:DataGridTemplateColumn>
<data:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Height="23" HorizontalAlignment="Left" Name="textBlock1" Text="{Binding name}" VerticalAlignment="Top" />
<TextBlock Height="23" HorizontalAlignment="Left" Name="textBlock2" Text="{Binding age}" VerticalAlignment="Top" />
</StackPanel>
</DataTemplate>
</data:DataGridTemplateColumn.CellTemplate>
</data:DataGridTemplateColumn>
</data:DataGrid.Columns>
</data:DataGrid>
這裡我們将DataGrid的源設為Human，這樣我們就完成了MVVM模式各個層次的初步建構，關鍵的問題是怎樣将這幾個部分有效的聯系起來
我們将PageView，PageViewModel引入到MainPage中
<UserControl x:Class="UseMVVMInApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:viw="clr-namespace:UseMVVMInApp.View"
xmlns:vmmodel="clr-namespace:UseMVVMInApp.ViewModel"
d:DesignHeight="300" d:DesignWidth="400">
<UserControl.Resources>
<vmmodel:PageViewModel x:Key="vm"></vmmodel:PageViewModel>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White" DataContext="{StaticResource vm}" >
<viw:PageView></viw:PageView>
</Grid>
</UserControl>
這裡的工作就是将PageViewModel聲明為一個資源，然後通過頁面引用它，這樣就實作了我們所謂的MVVM模式。
