天天看点

建立可扩展的silverlight 应用框架 step-3

应用架构

前边两章都是将的UI方面的知识。这里UI结构已经有了,现在要引人一个开发架构:Composite  “Prism”。

前期准备工作

首先在项目主页下载最新版本的Composite。

建立可扩展的silverlight 应用框架 step-3

<a href="http://compositewpf.codeplex.com/">http://compositewpf.codeplex.com/</a>

<a href="http://www.microsoft.com/downloads/details.aspx?FamilyID=387c7a59-b217-4318-ad1b-cbc2ea453f40&amp;displaylang=en">http://www.microsoft.com/downloads/details.aspx?FamilyID=387c7a59-b217-4318-ad1b-cbc2ea453f40&amp;displaylang=en</a>

我这里下载的是《Composite Application Guidance for WPF and Silverlight - October 2009》

解压安装

建立可扩展的silverlight 应用框架 step-3

编译项目

将以下的5个dll找出以作备用

建立可扩展的silverlight 应用框架 step-3

至此前期准备工作完成。

改造项目

1.为项目添加之前准备的几个DLL的引用

建立可扩展的silverlight 应用框架 step-3

2.重命名MainPage.xaml为Shell.xaml

3.打开Shell.xaml.cs文件将MainPage类重命名为Shell

建立可扩展的silverlight 应用框架 step-3

4.在XAML视图中修改x:Class 与之相对应的后端代码关联

建立可扩展的silverlight 应用框架 step-3

5.添加Region

在Shell.xaml中添加Prism的命名空间

    xmlns:Regions="clr-namespace:Microsoft.Practices.Composite.Presentation.Regions;assembly=Microsoft.Practices.Composite.Presentation"

这样子就可以为Region添加Prism中的依赖属性了。

在图中红色区域的Grid中添加一个ItemControl控件

建立可扩展的silverlight 应用框架 step-3

6.添加Bootstarpper,在项目中新建立一个Bootstrapper继承自UnityBootstrapper的类。

建立可扩展的silverlight 应用框架 step-3
建立可扩展的silverlight 应用框架 step-3

7.修改App.xaml,在app.xaml中修改其启动方法。

建立可扩展的silverlight 应用框架 step-3

至此,项目改造告一段落。下来为下图中的红色区域制作一个HelloWorld来看看效果。

建立可扩展的silverlight 应用框架 step-3

8.新建一个名为OperatingTableTestModule的silverlight类库。删除app.xaml、mainpage.xaml两个文件并添加对“Microsoft.Practices.Composite.dll”和“Microsoft.Practices.Composite.Presentation.dll”的引用。

建立可扩展的silverlight 应用框架 step-3

9.在项目中新建立一个文件夹“Views”,并在这个文件夹下创建一个HelloPrismView.xaml的文件。在其中绘制如下的图案。

建立可扩展的silverlight 应用框架 step-3

10.在项目中添加一个名为HelloPrismModule的类,它派生自IModule接口。

建立可扩展的silverlight 应用框架 step-3

在Initialize方法中,将MainRegion与Views中的HelloPrismView相关联。

建立可扩展的silverlight 应用框架 step-3

11.再回到OperatingTable项目中,添加其对OperatingTableTestModule项目的引用。找到Bootstarpper类,修改其GetModuleCatalog方法,使其加载刚才新建立的项目模块。

建立可扩展的silverlight 应用框架 step-3

编译项目 运行

建立可扩展的silverlight 应用框架 step-3

ok,这里看到了OperatingTableTestModule项目中的View替换了原先的ItemsControl。

扩展

这里看到了Hello Prism并没有自适应容器,而是根据自身的大小来做的布局。这里有一个小小的技巧。

为ItemsControl加一个Grid模板就可以做到。

建立可扩展的silverlight 应用框架 step-3
建立可扩展的silverlight 应用框架 step-3

再次运行

建立可扩展的silverlight 应用框架 step-3

如图,他自适应了容器大小,更加的美观了。

应用了Prism架构我们可以把界面拆分成若干小的模块,更加方面的以扩展模块的方式来开发silverlight应用。

演示地址:

<a href="http://dl.dropbox.com/u/432136/Samples/OperatingTableDemo/step-3/OperatingTableTestPage.html">http://dl.dropbox.com/u/432136/Samples/OperatingTableDemo/step-3/OperatingTableTestPage.html</a>

<a target="_blank" href="http://www.cnblogs.com/nasa/archive/2010/01/27/dropbox-host-silverlight.html">申请Dropbox来host你的Silverlight</a>

作者:Nasa 

版权声明:本文的版权归作者与博客园共有。转载时须注明本文的详细链接,否则作者将保留追究其法律责任。

参考资料:

<a href="http://www.cnblogs.com/Jax/archive/2009/05/25/1488797.html">http://www.cnblogs.com/Jax/archive/2009/05/25/1488797.html</a>

<a href="http://www.cnblogs.com/Jax/archive/2009/05/30/1491921.html">http://www.cnblogs.com/Jax/archive/2009/05/30/1491921.html</a>