Silverlight 4 + RIA Services之商业应用系列----9.1 MVVM+RIA Service

SourceCode：http://www.n-pei.com/download/SilverlightMVVM.rar

part1: 如何使用RIA Services

part2: RIA Services更新和验证

part3:RIA Services数据新增

part4:皮肤的更改

part5:报表的展示

part6:Endpoint的设置

part7:如何使用RIA Service Class Library 

part8:url重写和界面友好

part9:MVVM+RIA Service

MVVM模式或者简称VM模式是针对WPF和Silverlight这种具有很强的数据绑定功能的开发语言而提出的。之前有看过很多WPF的代码，大家基本上都是使用的MVVM模式开发。最近Silverlight4的火爆引出了Silverlight的MVVM模式开发也多了。

如果你对MVVM不了解我想下面的简单介绍应该会对你有帮助。

 

MVVM模式最大的好处是让整个开发过程中的UI设计和后台的代码编写完全分开了，大家互不影响，设计者可以专注于使用Express Blend等去设计页面也就是View，而开发的可以完全去通过Model来定义要操作的object,通过ViewModel来定义出来需要对这些model做哪些操作。最后使用Command来把Model和View完全联系到一起。

 

这是我写得第一篇MVVM文章，而且是使用RIA Service。我相信当你看完下面的文章，完全会理解并能够使用MVVM模式了。

1．  创建一个允许使用RIA Service的SilverLight Application:

相信不需要多说了。

2．  创建Model

这里以Product作为一个model:

 

3．  创建Domain Service

再创建Domain Service之前先准备一些数据,所以要创建一个class：

public class ProductRepository

    {

        private static readonly List<Product> Products =

            new List<Product>() {

                new Product { ProductID = 355, Name = "Rain Racer 2000", ModelNumber = "RU007", Description = "Looks like an ordinary bumbershoot, but don't be fooled! Simply place Rain Racer's tip on the ground and press the release latch. Within seconds, this ordinary rain umbrella converts into a two-wheeled gas-powered mini-scooter. Goes from 0 to 60 in 7.5 seconds - even in a driving rain! Comes in black, blue, and candy-apple red.", UnitCost = 99.99m }},

                  public IQueryable<Product> FindAllProducts() {

            return Products.AsQueryable();

        }

接下来创建一个空的domain service。我们需要手动添加一个方法来获得上面的Products这个list中的数据。

 

4．  View页面的添加：

实际上这里如果是设计人员在做页面，我们根本不需要管到底它页面上有哪些按钮，哪些功能。我们只需要去做接下来的一步，添加ViewModel。

这里我添加了一个页面，然后看一下它的页面XAML结点和后台的代码：

 

黑色线条上面就是传说中的SearchViewModel Class,所有的数据都有它提供。

下面红色圈住的地方你可能注意到就基本上是页面中的所有主要控件,RIA Service根本记没有在页面里，绿色部分是数据绑定，既然没有数据源哪来的绑定？是不是后台代码里初始化时把数据源给绑定了？看看后台代码：

  public SearchView() {

            InitializeComponent();

        }

什么都没有，所以说真正的MVVM模式中View页面的.cs文件都是可以去掉的。这就是为什么设计人员只需要专注于设计，开发人员只需要写代码。所以说数据绑定时MVVM最重要的。上面的SearchViewModel就是我们接下来要写得ViewModel。

5．  ViewModel类：

首先需要记住ViewModel必须继承Model类，或者是Model的继承类。

我们在ViewModel中需要做什么呢？需要做两件事情，1是在View页面加载时我们需要让它的DataGrid显示数据，2是我们提供一个搜索按钮，当页面上某个按钮点击时，重新从服务器端load数据。

 

你会发现在ViewModel类中的Properties Products和SelectedProduct就是上面View页面中DataBinding的内容。

当点击View中那个按钮时，ViewModel中的Search方法会执行：

public void Search(string keyword)

        {

            keyword = keyword.Trim();

            if (keyword.Length == 0)

            {

                return;

            }

 

            if (SearchStarting != null)

            {

                SearchStarting(this, EventArgs.Empty);

            }

 

            _catalog.Products.Clear();

 

            _catalog.Load(_catalog.GetProductsQuery(keyword), (lo) =>

                {

                 

                }, null);

            SearchCompleted(this, EventArgs.Empty);

           

        }

它通过传入的参数来从服务器得到Products,然后 清空当前的RIA Service数据源，重新绑定数据。

搞定，运行下看看结果：

 

如果有人需要这个源代码请告诉我。

Reference:

http://www.silverlightshow.net/items/Model-View-ViewModel-in-Silverlight.aspx

http://www.nikhilk.net/RIA-Services-MIX10.aspx

http://en.wikipedia.org/wiki/Model_View_ViewModel

http://msdn.microsoft.com/en-us/magazine/dd419663.aspx

http://msdn.microsoft.com/en-us/magazine/dd458800.aspx