1、ModuleLoader
在Asp.Net开发中,经常会把页面的公共部分封装成自定义控件ascx,以达到重用或动态加载的目的。在Flex4中MXML Module能达到类似的功能,可以把某些功能单独封装成在一个Module,然后利用ModuleLoader动态加载。
每个MXML Module在Build时,会生成一个同名的swf(比如A.mxml会生成A.swf),但是不能单独运行。
然后在主界面的mxml中,利用ModuleLoader组件来加载,示例代码如下:
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="400" minHeight="300" xmlns:ns1="*"> <s:layout> <s:BasicLayout/> </s:layout> <fx:Script> <![CDATA[ import mx.controls.Alert; import mx.events.ModuleEvent; protected function btnLoad_clickHandler(event:MouseEvent):void { mLoader.loadModule("ModuleStu.swf"); } protected function mLoader_loadingHandler(event:Event):void { trace("加载中..."); } protected function mLoader_readyHandler(event:ModuleEvent):void { trace("加载完成!"); } ]]> </fx:Script> <mx:ModuleLoader id="mLoader" right="10" top="10" left="10" bottom="40" loading="mLoader_loadingHandler(event)" ready="mLoader_readyHandler(event)"> </mx:ModuleLoader> <s:Button label="Load" id="btnLoad" click="btnLoad_clickHandler(event)" bottom="10" horizontalCenter="0"/> </s:Application>
不过Module加载后,并不象Asp.Net中的ascx那样好控制(也许仅仅只是我目前功力不够)
2、Alert以及TitleWindow
在应用程序中通过弹窗来显示一些消息,是常用的手段。Alert及TitleWindow能满足这种要求
弹出窗口LoginWindow.mxml (创建时 New-->MXML Component,Base on 这里选择spark.components.TitleWindow)
<?xml version="1.0" encoding="utf-8"?> <s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="334" height="146" title="请输入微薄内容" close="doClose()"> <s:layout> <s:BasicLayout/> </s:layout> <fx:Script> <![CDATA[ //引入需要的包 import mx.managers.PopUpManager; import mx.controls.Alert; import mx.events.CloseEvent; import spark.components.TextArea; private var _txtContent:TextArea; public function get txtContent():TextArea { return _txtContent; } public function set txtContent(value:TextArea):void { _txtContent = value; } private function doClose():void { Alert.yesLabel = "是"; Alert.noLabel = "否"; Alert.show("确定要退出吗?", "提示", Alert.YES|Alert.NO, this, alertClickHandler); } private function alertClickHandler(evt:CloseEvent):void { if (evt.detail == Alert.YES) { //关闭自身 PopUpManager.removePopUp(this); } } private function doSend():void { if (txtMsg.text.length>0){ //在关闭窗口前,给父窗口中的相关文本框赋值(注:这要求在父窗口中调用时,得按约定传递txtContent的引用) txtContent.text = txtMsg.text; } //关闭自身 PopUpManager.removePopUp(this); } ]]> </fx:Script> <s:TextArea x="10" y="11" width="312" height="61" id="txtMsg"/> <s:Button x="131" y="84" label="发 送" id="btnSend" click="doSend()"/> </s:TitleWindow>
调用的主窗口TitleWindowDemo.mxml
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <fx:Script> <![CDATA[ import mx.managers.PopUpManager; private function showWindow():void { var _loginWin:LoginWindow = PopUpManager.createPopUp(this,LoginWindow,true) as LoginWindow; PopUpManager.centerPopUp(_loginWin); //给弹出窗口的txtContent传递引用 _loginWin.txtContent = this.txtResult; } ]]> </fx:Script> <s:TextArea top="10" left="10" right="10" bottom="40" id="txtResult" editable="false"/> <s:Button label="发微薄" horizontalCenter="0" bottom="10" id="btnWrite" click="showWindow()"/> </s:Application>