使用Simple MVVM框架开发windows phone应用程序(2)

Simple MVVM下载安装
    从http://simplemvvmtoolkit.codeplex.com/下载最新的安装包,最新的版本是2.1
   安装完毕后,会自动在vs建立simple MVVM的template
创建第一个Simple MVVM项目
启动vs2010,选择Silverlight for Windows Phone--Mvvm

3-1-2012 3-47-18 PM.png

创建成功后,解决方案如下:

3-1-2012 3-48-25 PM.png

Simple MVVM自动把你的项目安装MVVM的要求分成各个文件夹。非常清晰
Views,Models,ViewModels文件夹就不用我多讲了吧,很清楚了。
Locators文件夹是用来关联View和ViewModel的
Services文件夹放了一个接口和一个实现接口的类,主要用来实现你应用程序的业务逻辑。采用了接口,所以在Locators文件夹里,可以通过IOC来实现接口的不同的实例化。本例子中没有使用IOC.
另外Simple MVVM新建的项目里,默认带了一个实现的例子,Customer

下面我们一步一步来,实现一个自己的页面。这个页面很简单就是单击一个按钮,显示一个list在页面上。
1)        在models文件夹,新增加一个Product类,这个类继承ModelBase<Product>

2)        使用mvvmprop code snippet增加两个属性:
ProductId (int)
ProductName (string)

3-1-2012 3-58-36 PM.png



3)        在Services文件夹增加一个接口IProductServiceAgent

3-1-2012 4-00-01 PM.png

4)        增加MockProductServiceAgent类实现接口IProductServiceAgent

3-1-2012 4-08-54 PM.png

5)        右键单击ViewModels文件夹,选择新增一个item. 从模板中选择SimpleMvvmViewModel,名字改为ProductListViewModel

3-1-2012 4-04-07 PM.png

把注释的/* IXxxServiceAgent */ 换为IProductServiceAgent
在ProductListViewModel里使用mvvmprop code snippet增加一个Products属性。
增加一个LoadProducts()方法

3-1-2012 4-10-00 PM.png


增加一个command用来绑定页面上button的click事件:

3-1-2012 4-11-40 PM.png


接下来,我们要绑定view和viewmodel直接的联系了。
在Locators文件夹下面,更改ViewModelLocator.cs的代码
增加下面的代码:

3-1-2012 4-17-08 PM.png

接下来,我们该创建一个页面,用来显示数据。添加一个页面,名字为:ProductListView.xaml

在页面上,引用以下命名空间,并且绑定Locator,用来关联view和view model

3-1-2012 4-14-38 PM.png


然后在页面上增加一个button,单击加载数据,增加一个listbox显示数据,如图:

3-1-2012 4-19-12 PM.png

注意红色标注的地方。

大功告成,启动页面,看看效果,单击按钮,会加载数据再listbox
posted @ 2012-07-26 15:41  therockthe  阅读(279)  评论(0编辑  收藏  举报