flex框架pureMVC的使用：第一步

发布时间：2020-12-15 04:21:21 所属栏目：百科来源：网络整理

导读：理论知识看得差不多了，但是动起手来就不知道框架到底是怎么回事了，这篇文章用一个小例子切入，很不错，转载和大家一起分享。 flex框架pureMVC的使用：第一步关键字: flex puremvc ??? 做flex做久做大了，使用一个框架便是自然而然的事情。这样程序才会更

理论知识看得差不多了，但是动起手来就不知道框架到底是怎么回事了，这篇文章用一个小例子切入，很不错，转载和大家一起分享。

flex框架pureMVC的使用：第一步

关键字: flex　puremvc

??? 做flex做久做大了，使用一个框架便是自然而然的事情。这样程序才会更健壮，更易于扩展，更易于维护。pureMVC足够简单，核心也只有十来个类，是一个轻量级的Flex框架，只一天的时间，就可以学通，没有理由不用它的。

??? 麻雀虽小，五脏俱全，pureMVC，直译过来就是“纯MVC”，是一个MVC框架。官方的中文文档有44页，放在附件中，可以下载了看。推荐一个入门的文章给大家。（http://riachina.com/showtopic-11011.html?），里面有足够全面的介绍。这里我想利用一个更加简单的图片展示的例子来展示pureMVC的使用细节。先看效果：

? 介绍一下这个应用。程序一开始便请求展示的图片信息（包括图片的链接以及名称），得到信息后便可以通过两个按钮进行逐张的浏览。这个例子太简单了，以致根本没有必要去用pureMVC，这里我只是想借用它来介绍pureMVC如何使用的。

??? 如果将上面的例子假设为做菜，哈哈，就会更有意思了。两个 Button,一个 Image 与 Label 便是锅碗瓢盆,而图片的信息便是原料，而怎么样来炒，便要看菜谱了。pureMVC 的设计者估计也是做菜的高手。这些对他们来说就是 Model (原料),View (锅碗瓢盆),Controller (菜谱)，三个都是单例模式。同时他们还设计出一个厨师,叫 Facade ，由它来调度上面三个，也是单例的。

??? 一切从 Facade 开始，它实列化 Model,View,Controller 。MVC 也找了一些帮手,Model 找到的是 Proxy 们，代理？好像翻译得不对。不管，以后的数据就靠它了。View 找的是 Mediator，它们负责UI，Controller 找的是 Command，不过 Command 性格比较怪，做完一次任务就不干了，也就是短生命同期的。每次用它 pureMVC 都会重新创建。所以只能用它来做业务逻辑，而不要将长期的数据放在里面。

??? pureMVC 消息采用的观察者模式，每次做完一件事情，就可以向外发出一个 Notification? (不是 Flex 里的 Event 哟)，就像向外宣布“事情做完了”，具体谁关心就管不着了。这里 Proxy 有点特别，它们只会向外发出 Notification ，但从不接收，只关心自己的数据模型。这很有意义，想想人家叫 “纯MVC” 嘛。

??? 好了，开始做这个例子。刚开始学东西的时候总会发现，文档都看懂了，东西好像都会了。真要用它做东西，却不知道怎么下手。所以还要再好好分析下程序，看看怎么样下手。

?? 首先界面上就四个控件，两个Button ，一个 Image 和一个Label ，从功能上可以分为两类，两个 Button 是用来作控制的， Image 与 Label 用来显示图片及图片名称。和 UI 对应的是 Mediator,所以要定义两个 Mediator 类。如果程序变大了，也可以这样来划分，千万不要为每个按钮作一个 Mediator ，也不要整个 Application 才一个 Mediator，最好按功能来划分。

?? 然后再来看 Model,本例中的数据只有一项，便是要显示的图片资料。所以只要求定义一个 Proxy 用来数据交互就够了。flex 得到数据的方式有许多种，如HttpService,RemoteObject,XMLSocket等，但不管什么，总之都是从其他地方得到有用的信息，然后将它变成自己自己的程序能够理解的形式。当然解析数据，大多是业务逻辑( Controller )的工作了。

?? 再看Controller这边，Controller 涉及到业务，本例中业务有程序启动（StartUp），还有个就是得到图片信息。还有吗，好像没有了。两个Command就可以应付了。

??? 好了，可以动手编码了。

定义两个Mediator (ImageMediator 与 ControlBtnsMediator,继承Mediator类，实现IMediator接口)，

两个Command　( StartUpCommand 与 GetUrlListCommand，继承SimpleCommand类，实现ICommand)　

以及一个Proxy　(ImageUrlListProxy ，继承Proxy，实现IProxy接口)

一个图片信息类(ImageUrlVO)，用来存放单张图片信息。

一个Facade (MyAppFacade　继承Facade，实现IFacade接口)

程序的包结构：

同时思考需要的　Notification ，它是将整个框架联系起来的关键。

1.程序开始便要启动 StrartUpCommand，所以StrartUpCommand　要关注 "app_startup"

2.StrartUpCommand主要完成Proxy与Mediator的注册，完成后便可以启动GetUrlListCommand，所以GetUrlListCommand应关注"app_startup_over"

3.GetUrlListCommand　通过 ImageUrlListProxy去获取图片信息，前面提到 ImageUrlListProxy是不能接收Notification，所以GetUrlListCommand要直接调用ImageUrlListProxy的public成员函数loadUrlList()去获取图片信息

4.ImageUrlListProxy　得到图片链接以后，便可以对外宣布“图片信息已经得到了”，即对外Send一个"url_load_complete"的Notification,关注这一Notification的自然是ImageMediator，它直接将图片信息保存起来，并显示第一张图片内容

5.ControlBtnsMediator不需要关注任何Notification，不过点击两个按钮时会向外Send　Notification ("next_image"　与 "prev_image")，，通知显示下一张或上一张图片。关注这两个Notification的自然是ImageMediator了。

好了，流程都介绍完了，来看代码。

先定义类　ImageUrlVO　的代码如下：

     Java代码? 
    
 package?MyApp.Model.VO ??
 { ??
 ????public?class?ImageUrlVO ??
 ????{ ??
 ????????public?var?url:String;????//图片链接???
public?var?name:String;??//图片名称???
public?function?ImageUrlVO(url:String,name:String){ ??
 ????????????this.url?=?url; ??
this.name?=?name; ??
 ????????} ??
 ????} ??
 }??

[java]? 
    view plain 
    copy 
     
    

package?MyApp.Model.VO??
{??
????public?class?ImageUrlVO??
????{??
????????public?var?url:String;????//图片链接??
????????public?var?name:String;??//图片名称??
public?function?ImageUrlVO(url:String,name:String){??
????????????this.url?=?url;??
????????????this.name?=?name;??
????????}??
????}??
}??

??? 接下来从程序的执行步骤依次看各个类的代码。

??? 主界面　HelloPureMVC.mxml：

     Xml代码? 
    

<?xml?version="1.0"?encoding="utf-8"?>??

<mx:Application?xmlns:mx="http://www.adobe.com/2006/mxml"?layout="absolute"??
??width="200"?height="200"?creationComplete="initApp()">? ??
??mx:Script>??
????<![CDATA[??
????????import?MyApp.MyAppFacade;??
????????public?function?initApp():void{??
????????????var?facade:MyAppFacade?=?MyAppFacade.getInstance();??
????????????facade.startup(?this?);??
????????}??
????]]>??
</ ?mx:Canvas?id="mainContainer"?width="100%"?height="100%">??
mx:Label?id="nameLabel"?x="87.5"?y="0"/>??
mx:Image?id="image"?x="30"?y="20"?width="140"?height="140"mx:Button?x="10"?y="168"?label="上一张"?id="btnPrev"mx:Button?x="125"?y="168"?label="下一张"?id="btnNext" ? ??
mx:Canvasmx:Application>??

[xml]? 
    copy

<?xml?version="1.0"?encoding="utf-8"?>??

<mx:Application?xmlns:mx="http://www.adobe.com/2006/mxml"?layout="absolute"??
??width="200"?height="200"?creationComplete="initApp()">???
??mx:Script>??
????<![CDATA[?
????????import?MyApp.MyAppFacade;?
????????public?function?initApp():void{?
????????????var?facade:MyAppFacade?=?MyAppFacade.getInstance();?
????????????facade.startup(?this?);?
????????}?
????]]>??
</ ?mx:Canvas?id="mainContainer"?width="100%"?height="100%">??
mx:Label?id="nameLabel"?x="87.5"?y="0"/>??
??mx:Image?id="image"?x="30"?y="20"?width="140"?height="140"/>??
mx:Button?x="10"?y="168"?label="上一张"?id="btnPrev"mx:Button?x="125"?y="168"?label="下一张"?id="btnNext" ???
mx:Canvasmx:Application>??

?　主界面现在只关注布局就够了。同时还要注意到里面的initApp()函数，它首先得到Facade实例，再调用其　startup()　函数启动整个PureMVC框架。

　　跟进去再让看　MyAppFacade　的实现。

package?MyApp ??import?MyApp.Controller.GetUrlListCommand; ??
import?MyApp.Controller.StartUpCommand; ??
import?org.puremvc.as3.interfaces.IFacade; ??
import?org.puremvc.as3.patterns.facade.Facade; ??
 ??
class?MyAppFacade?extends?Facade?implements?IFacade ??
static?const?APP_STARTUP:String?=?"app_startup"; ??
const?APP_STARTUP_OVER:String?=?"app_startup_over"; ??
 ???????? ??
public?function?MyAppFacade() ??
 ????????{ ??
super(); ??
static?function?getInstance():MyAppFacade{ ??
if(instance==null)?instance?=?new?MyAppFacade(); ??
return?instance?as?MyAppFacade; ??
 ????????}??????????????????????????????????? ??
 ????????override?protected?function?initializeController():void{ ??
super.initializeController(); ??
 ????????????//register?some?Commands???
 ????????????registerCommand(APP_STARTUP,StartUpCommand); ??
 ????????????registerCommand(APP_STARTUP_OVER,GetUrlListCommand); ??
public?function?startup(app:Object):void{??????? ??
 ????????????sendNotification(APP_STARTUP,app);?? ??
 ????????}??? ??
copy 
     
    

?MyApp??

import?MyApp.Controller.GetUrlListCommand;??
????import?MyApp.Controller.StartUpCommand;??
import?org.puremvc.as3.interfaces.IFacade;??
import?org.puremvc.as3.patterns.facade.Facade;??
??
class?MyAppFacade?extends?Facade?implements?IFacade??
????{??
static?const?APP_STARTUP:String?=?"app_startup";??
const?APP_STARTUP_OVER:String?=?"app_startup_over";??
??????????
public?function?MyAppFacade()??
????????{??
super();??
??????????
static?function?getInstance():MyAppFacade{??
if(instance==null)?instance?=?new?MyAppFacade();??
return?instance?as?MyAppFacade;??
????????}?????????????????????????????????????
????????override?protected?function?initializeController():void{??
super.initializeController();??
????????????//register?some?Commands??
????????????registerCommand(APP_STARTUP,StartUpCommand);??
????????}??
public?function?startup(app:Object):void{?????????
????????????sendNotification(APP_STARTUP,app);????
????????}?????
????}??
}??

??? 可见Facade做的事情很简单， initializeController()　是用来初始化Controller的，这个函数是建立各个Notification与Command映射的地方，有了上面的流程分析，

registerCommand(APP_STARTUP,StartUpCommand); ?? registerCommand(APP_STARTUP_OVER,GetUrlListCommand);??

copy 
     
    

registerCommand(APP_STARTUP,StartUpCommand);??

这两行这很容易了。startup()函数，终于轮到它了。它只做了一件事情，就是向外派发一个APP_STARTUP的Notification，关注它的是前面已经建立映射的StartUpCommand，pureMVC会实例化一个StartUpCommand的实例，并将app作为参数，调用其execute函数。

tip:通常用一个字符串来标识一个Notification，不过建议用字符常量。减少犯错的可能。

?

　再来看StartUpCommand的代码：

package?MyApp.Controller ??
import?MyApp.Model.ImageUrlListProxy; ??
import?MyApp.MyAppFacade; ??
import?MyApp.View.ControlBtnsMediator; ??
import?MyApp.View.ImageMediator; ??
import?org.puremvc.as3.interfaces.ICommand; ??
import?org.puremvc.as3.interfaces.INotification; ??
import?org.puremvc.as3.patterns.command.SimpleCommand; ??
class?StartUpCommand?extends?SimpleCommand?implements?ICommand ??
public?function?StartUpCommand() ??
????????}??????? ??
public?function?execute(notification:INotification):void??
????????????var?app:HelloPureMVC?=?notification.getBody()?as?HelloPureMVC; ??
//注册代理(proxy)???
????????????facade.registerProxy(?new?ImageUrlListProxy(?ImageUrlListProxy.NAME?)?); ??
//注册中介器???
????????????facade.registerMediator(?new?ImageMediator(? ??
???????????????????ImageMediator.NAME,? ??
???????????????????{ ??
?????????????????????image:app.image,??
?????????????????????nameLabel:app.nameLabel ??
???????????????????} ??
????????????)?); ??
???????????? ??
new?ControlBtnsMediator( ??
????????????????????ControlBtnsMediator.NAME?,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ????????????????????{ ??
????????????????????????btnNext:app.btnNext,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ????????????????????????btnPrev:app.btnPrev ??
????????????????????} ??
//通知已经初始化完毕???
????????????sendNotification(MyAppFacade.APP_STARTUP_OVER,app);????????????? ??
copy
1. import?MyApp.Model.ImageUrlListProxy;??
2. import?MyApp.MyAppFacade;??
3. import?MyApp.View.ControlBtnsMediator;??
4. import?MyApp.View.ImageMediator;??
5. import?org.puremvc.as3.interfaces.ICommand;??
6. import?org.puremvc.as3.interfaces.INotification;??
7. import?org.puremvc.as3.patterns.command.SimpleCommand;??
8. ??
9. class?StartUpCommand?extends?SimpleCommand?implements?ICommand??
10. public?function?StartUpCommand()??
11. ????????}?????????
12. ????????override?public?function?execute(notification:INotification):void??
13. ????????????var?app:HelloPureMVC?=?notification.getBody()?as?HelloPureMVC;??
14. //注册代理(proxy)??
15. ????????????facade.registerProxy(?new?ImageUrlListProxy(?ImageUrlListProxy.NAME?)?);??
16. //注册中介器??
17. ????????????facade.registerMediator(?new?ImageMediator(???
18. ???????????????????{??
19. ?????????????????????nameLabel:app.nameLabel??
20. ???????????????????}??
21. ????????????)?);??
22. ??????????????
23. new?ControlBtnsMediator(??
24. ????????????????????{??
25. ????????????????????????btnPrev:app.btnPrev??
26. ????????????????????}??
27. //通知已经初始化完毕??
28. ????????????sendNotification(MyAppFacade.APP_STARTUP_OVER,app);???????????????
29. }??
??? 只有一个execute()函数，它的任务便是注册前面提到的两个Mediator和一个Proxy，用到的是registerProxy()与registerMediator()两个函数，完成注册后便可以对外Send　MyAppFacade.APP_STARTUP_OVER 了。关注这一Notificator的便是前面已经建立映射的 GetUrlListCommand 。同样一个 GetUrlListCommand 会被实例化，再调用其execute()函数。

?

tip:Proxy类的构造函数需要一个proxyName:String作为其唯一标识，可以通过这一字符串得到该Proxy的引用，这里也建议使用字符常量

?

class?GetUrlListCommand?public?function?GetUrlListCommand() ??
//得到图片链接???
????????????(facade.retrieveProxy(?ImageUrlListProxy.NAME?)?as?ImageUrlListProxy).loadUrlList();???????? ??
copy
1. import?org.puremvc.as3.interfaces.INotification;??
2. import?org.puremvc.as3.patterns.command.SimpleCommand;??
3. class?GetUrlListCommand?implements?ICommand??
4. public?function?GetUrlListCommand()??
5. ????????{??
6. super();??
7. ????????????//得到图片链接??
8. ????????????(facade.retrieveProxy(?ImageUrlListProxy.NAME?)?as?ImageUrlListProxy).loadUrlList();??????????
9. }??
??? 好简单，呵呵，得到 ImageUrlListProxy 的实例，调用其loadUrlList()函数就可以了。前面提到Proxy不会去接收任何Notification，所以只能通过调用其成员函数的形式来使用它。

　看看ImageUrlListProxy的代码：

?

package?MyApp.Model ??
import?MyApp.Model.VO.ImageUrlVO; ??
import?org.puremvc.as3.interfaces.IProxy; ??
import?org.puremvc.as3.patterns.proxy.Proxy; ??
class?ImageUrlListProxy?extends?Proxy?implements?IProxy ??
const?NAME:String?=?"ImageUrlListProxy"; ??
????????//定义一些Notification字符常量???
const?URL_LOAD_COMPLETE:String?=?"url_load_complete"; ??
public?function?ImageUrlListProxy(proxyName:String=null,?data:Object=null) ??
????????{??????????? ??
super(proxyName,data); ??
public?function?loadUrlList():void{????????? ??
????????????data?=?new?Array(); ??
//push六张图片的Url???
????????????data.push(new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic1.jpg","卡莫")); ??
new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic2.jpg","李时珍")); ??
new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic3.jpg","姚明")); ??
new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic4.jpg","费得了")); ??
new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic5.jpg","伍兹")); ??
new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic6.jpg","不认得"));? ??
//通知image?Url已经全部得到了???
if(data==null)trace("data?is?null"); ??
????????????sendNotification(?URL_LOAD_COMPLETE?,data?);???????????????????? ??
????????}??????????? ??
copy
1. import?MyApp.Model.VO.ImageUrlVO;??
2. import?org.puremvc.as3.interfaces.IProxy;??
3. import?org.puremvc.as3.patterns.proxy.Proxy;??
4. class?ImageUrlListProxy?extends?Proxy?implements?IProxy??
5. const?NAME:String?=?"ImageUrlListProxy";??
6. ????????//定义一些Notification字符常量??
7. const?URL_LOAD_COMPLETE:String?=?"url_load_complete";??
8. public?function?ImageUrlListProxy(proxyName:String=null,153); background-color:inherit; font-weight:bold">null)??
9. ????????{?????????????
10. super(proxyName,data);??
11. ????????}?????????
12. public?function?loadUrlList():void{???????????
13. ????????????data?=?new?Array();??
14. //push六张图片的Url??
15. ????????????data.push(new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic1.jpg","卡莫"));??
16. ????????????data.push(new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic2.jpg","李时珍"));??
17. new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic3.jpg","姚明"));??
18. new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic4.jpg","费得了"));??
19. new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic5.jpg","伍兹"));??
20. new?ImageUrlVO("http://www.mjbox.com/r/io/ioryioryzhan/pic6.jpg","不认得"));???
21. //通知image?Url已经全部得到了??
22. if(data==null)trace("data?is?null");??
23. ????????????sendNotification(?URL_LOAD_COMPLETE?,data?);??????????????????????
24. ????????}?????????????
25. }??
?　loadUrlList()函数去得到图片信息，由于没有后台，所以只能用这种直接写硬编码的方式了，
?，会有很多方式得到数据，如前面提到的HttpService及RemoteObject等。同步的异步的都可以用。

　Proxy　有一个data成员，是个Object，用来盛放接收到的数据。得到数据后便可以Send一个Notification (URL_LOAD_COMPLETE)了。接下来看关注这个Notification的ImageMediator。

?

package?MyApp.View ??
import?mx.controls.Alert; ??
import?mx.controls.Image; ??
import?mx.controls.Label; ??
???? ??
import?org.puremvc.as3.interfaces.IMediator; ??
import?org.puremvc.as3.patterns.mediator.Mediator; ??
class?ImageMediator?extends?Mediator?implements?IMediator ??
const?NAME:String?=?"ImageMediator"; ??
private?var?arrayOfImage:Array=null;? ??
private?var?currentIndex:int=-1; ??
public?function?ImageMediator(mediatorName:String=super(mediatorName,?viewComponent); ??
public?function?listNotificationInterests():Array{ ??
//列出感兴趣的Notification???
return?[ ??
??????????????ImageUrlListProxy.URL_LOAD_COMPLETE,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ??????????????ControlBtnsMediator.NEXT_IMAGE,248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ??????????????ControlBtnsMediator.PREV_IMAGE???????? ??
????????????]; ??
public?function?handleNotification(notification:INotification):void{??????????? ??
switch(notification.getName()){ ??
????????????????case?ImageUrlListProxy.URL_LOAD_COMPLETE:??????? ??
????????????????????arrayOfImage?=?notification.getBody()?as?Array;??? ??
????????????????????if(arrayOfImage){ ??
????????????????????????trace(arrayOfImage.length); ??
????????????????????????trace((viewComponent.nameLabel?as?Label).text); ??
????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[0]?as?ImageUrlVO).name; ??
????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[0]?as?ImageUrlVO).url; ??
????????????????????????currentIndex?=?0; ??
????????????????????}else{ ??
????????????????????????Alert.show("没有得到图片链接","错误"); ??
???????????????????? ??
break;?? ??
case?ControlBtnsMediator.NEXT_IMAGE: ??
if(currentIndex==-1)break; ??
if(currentIndex?>=?arrayOfImage.length-1?){Alert.show("已经是最后一张图片了","错误");} ??
????????????????????????trace((viewComponent.nameLabel?as?Label)); ??
????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[currentIndex+1]?as?ImageUrlVO).name; ??
????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[currentIndex+1]?as?ImageUrlVO).url; ??
????????????????????????++currentIndex; ??
????????????????????}??????????????????? ??
case?ControlBtnsMediator.PREV_IMAGE: ??
if(currentIndex?==0?){Alert.show("目前是第一张图片",248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[currentIndex+- ????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[currentIndex- ????????????????????????--currentIndex; ??
break;?????????? ??
default: ????????????}??????????? ??
????????}??????????????????? ??
copy
1. import?mx.controls.Alert;??
2. import?mx.controls.Image;??
3. import?mx.controls.Label;??
4. ??????
5. import?MyApp.Model.VO.ImageUrlVO;??
6. import?org.puremvc.as3.interfaces.IMediator;??
7. import?org.puremvc.as3.patterns.mediator.Mediator;??
8. class?ImageMediator?extends?Mediator?implements?IMediator??
9. const?NAME:String?=?"ImageMediator";??
10. private?var?arrayOfImage:Array=null;???
11. private?var?currentIndex:int=-1;??
12. public?function?ImageMediator(mediatorName:String=super(mediatorName,?viewComponent);??
13. public?function?listNotificationInterests():Array{??
14. //列出感兴趣的Notification??
15. return?[??
16. ??????????????ImageUrlListProxy.URL_LOAD_COMPLETE,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ??????????????ControlBtnsMediator.PREV_IMAGE??????????
17. ????????????];??
18. ????????}?????
19. public?function?handleNotification(notification:INotification):void{?????????????
20. switch(notification.getName()){??
21. ????????????????case?ImageUrlListProxy.URL_LOAD_COMPLETE:?????????
22. ????????????????????arrayOfImage?=?notification.getBody()?as?Array;?????
23. ????????????????????if(arrayOfImage){??
24. ????????????????????????trace(arrayOfImage.length);??
25. ????????????????????????trace((viewComponent.nameLabel?as?Label).text);??
26. ????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[0]?as?ImageUrlVO).name;??
27. ????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[0]?as?ImageUrlVO).url;??
28. ????????????????????????currentIndex?=?0;??
29. ????????????????????}else{??
30. ????????????????????????Alert.show("没有得到图片链接","错误");??
31. ????????????????????}??
32. ??????????????????????
33. break;????
34. ????????????????case?ControlBtnsMediator.NEXT_IMAGE:??
35. if(currentIndex==-1)break;??
36. ????????????????????if(currentIndex?>=?arrayOfImage.length-1?){Alert.show("已经是最后一张图片了","错误");}??
37. ????????????????????????trace((viewComponent.nameLabel?as?Label));??
38. ????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[currentIndex+1]?as?ImageUrlVO).name;??
39. ????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[currentIndex+1]?as?ImageUrlVO).url;??
40. ????????????????????????++currentIndex;??
41. ????????????????????}?????????????????????
42. case?ControlBtnsMediator.PREV_IMAGE:??
43. if(currentIndex?==0?){Alert.show("目前是第一张图片",248); line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> ????????????????????????(viewComponent.nameLabel?as?Label).text?=?(arrayOfImage[currentIndex+-1]?as?ImageUrlVO).name;??
44. ????????????????????????(viewComponent.image?as?Image).source?=?(arrayOfImage[currentIndex-1]?as?ImageUrlVO).url;??
45. ????????????????????????--currentIndex;??
46. break;????????????
47. default: ????????????}?????????????
48. ????????}?????????????????????
49. }??
?　ImageMediator除了关注ImageUrlListProxy.URL_LOAD_COMPLETE外，还要关注ControlBtnsMediator.NEXT_IMAGE以及ControlBtnsMediator.PREV_IMAGE,即为示下一张或上一张图片。

?

　　具体怎么将Mediator与其关注的Notification关联起来呢，listNotificationInterests()，就是它了。它要求返回一个字符数组，在注册这个Mediator时，该函数就会被调用，之后，当一个Notification被发送时，如果该Notification的字符串存在于这个字符数组时，这个Mediator就能接收到。

?

　处理Notification是在handleNotification()函数内进行的，通过switch/case的方式，对不同的Notification进行不同的处理。会MFC的筒子们一定会觉得好熟悉啊，在　MFC　里，窗口函数也是这样来处理消息的。

?

　具体代码就不分析了，很简单的。

?

　最后就只有ControlBtnsMediator了。

?

import?flash.events.MouseEvent; ??
import?mx.controls.Button; ??
class?ControlBtnsMediator?const?NAME:String?=?"ControlBtnsMediator"; ??
const?NEXT_IMAGE:String?=?"next_image"; ??
const?PREV_IMAGE:String?=?"prev_image"; ??
public?function?ControlBtnsMediator(mediatorName:String= ????????????(viewComponent.btnPrev?as?Button).addEventListener(MouseEvent.CLICK,onClickPrev); ??
????????????(viewComponent.btnNext?as?Button).addEventListener(MouseEvent.CLICK,onClickNext); ??
private?function?onClickPrev(e:MouseEvent): ????????????sendNotification(PREV_IMAGE); ??
private?function?onClickNext(e:MouseEvent): ????????????sendNotification(NEXT_IMAGE); ??
copy
1. import?mx.controls.Button;??
2. import?org.puremvc.as3.patterns.mediator.Mediator;??
3. class?ControlBtnsMediator?implements?IMediator??
4. const?NAME:String?=?"ControlBtnsMediator";??
5. const?NEXT_IMAGE:String?=?"next_image";??
6. const?PREV_IMAGE:String?=?"prev_image";??
7. public?function?ControlBtnsMediator(mediatorName:String=null)??
9. ????????????(viewComponent.btnNext?as?Button).addEventListener(MouseEvent.CLICK,onClickNext);??
10. private?function?onClickPrev(e:MouseEvent):void{??
11. ????????????sendNotification(PREV_IMAGE);??
12. private?function?onClickNext(e:MouseEvent): ????????????sendNotification(NEXT_IMAGE);??
13. }??
?　注册监听，响应时发送相应的Notification。

　好了，都介绍完了，点击运行吧。

??? 附件中有一个pureMVC的中文文档，以及Project的源文件，pureMVC的代码Project的源文件中。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!