关于Moduler

摘自http://xinsync.xju.edu.cn/index.php/archives/1870

Flex 2.0.1 Modular的一个例子

我们在FLEX BUILDER里建立三个项目,一个专门放MODULARS,一个为SHELL,最后一个是Interface.当然,视需要我们也可以建立多个项目.
当然,Shell(ModularMain)就是我们的主程序,相当于我们的EXE文件;
Modulars(Modulars)就是我们的DLL文件的聚集地J 当然合适的建立模块,可以使得我们的程序更具扩展性和部署.
Interface(UserModularsInterface)这不是必须的,但我建议在团队合作和大型程序开发的时候采用接口.接口的具体功能我就不在这里说了,可以找本OOD书看一下.简单的说就是模块之间混合编程所统一的必须的方法或属性.接口没有具体的实现方法,只是声明了方法或属性.
在这个例子中,我们建立了三个Modular,一个是在Shell项目中的InnerModular.mxml . 另一个是在 Modulars中的OuterModular.mxml . 这个Modular和InnerModular相似. 最后一个是在Modulars中的 OuterModularWithInterface.mxml . 这个Modular和前两个区别不大,仅仅是使用了Interface(推荐使用这种方式).
首先我们看一下Inner Modular. 为什么取名为Inner Modular是因为这个Modular是和Shell在同一个Project中.
InnerModular.mxml
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Module xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute”>
<mx:Script>
<![CDATA[
[Bindable]
public var textValue:String = ”(default inner text value)”;
]]>
</mx:Script>
<mx:Label text=”{textValue}”/>
</mx:Module>
在源程序中,唯一要注意的就是我们新建一个Application的时候,红色标记部分是引用的Application标签.把它改为Module即可.
引用中,ModularMain.mxml中
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” creationComplete=”init()”>
<mx:Script>
<![CDATA[
import mx.modules.*;
import mx.events.ModuleEvent;
private var mdInnerModular:Object;
private function init():void
{
mdInner.addEventListener(ModuleEvent.READY,onInnerModularLoaded);
}
private function onInnerModularLoaded(evt:ModuleEvent):void
{
mdInnerModular = mdInner.child;
mdInnerModular.textValue = "Inner Modular";
}
private function CallIOuterModularFunction():void
{
var iOuter:IOuterModular = mdOuterWithInterface.child as IOuterModular;
iOuter.SetText("IOuter Called");
}
]]>
</mx:Script>
<mx:ModuleLoader id=”mdInner” url=”InnerModular.swf”/>
<mx:ModuleLoader id=”mdOuter” url=”assets/OuterModular.swf” y=”20″/>
<mx:Button label=”Set Outer Modular Value” click=”(mdOuter.child as Object).textValue = ’Outer Modular’” y=”40″/>
<mx:Button label=”Call Outer Modular Function” click=”(mdOuter.child as Object).testFunction()” y=”70″/>
<mx:ModuleLoader id=”mdOuterWithInterface” url=”assets/OuterModularWithInterface.swf” y=”90″/>
<mx:Button label=”Call Outer Modular Function” click=”CallIOuterModularFunction()” y=”120″/>
</mx:Application>
Shell中的有红色部分是对InnerModular的操作.注意的就是要执行Modular中的方法或者更改属性必须等ModularLoader触发了ModuleEvent.READY 后才能执行.
OuterModular.mxml:
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Module xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute”>
<mx:Script>
<![CDATA[
[Bindable]
public var textValue:String = ”(default outer text value)”;
public function testFunction():void
{
this.textValue = ”Outer Function Called”;
}
]]>
</mx:Script>
<mx:Label text=”{textValue}” />
</mx:Module>
内容和InnerModular一样.不一样的是放在了另一个Project中.
而我推荐的是使用Interface.下面我们就看一下使用了Interface的操作方法.
首先我们要定义Interface文件,为了方便,我们新建立一个Lib Project.这样编译后会生成一个swc的可被引用的代码包.
在Shell和Modular的Project中添加引用.
在Modular中实现具体的接口中定义的方法或属性.
IOuterModular.as
package
{
import flash.events.IEventDispatcher;
public interface IOuterModular extends IEventDispatcher
{
function SetText(val:String):void;
}
}
在接口中,我们定义了SetText这个方法.于是我们在Modular中先实现这方法:
OuterModularWithInterface.mxml
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Module xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” implements=”IOuterModular”>
<mx:Script>
<![CDATA[
[Bindable]
public var textValue:String = ”(default outer(with interface) text value)”;
public function SetText(val:String):void
{
this.textValue = val;
}
]]>
</mx:Script>
<mx:Label text=”{textValue}” />
</mx:Module>
其中红色部分标记了此Modular为接口IOuterModular的实现. 蓝色部分则是具体实现的方法.
在ModularMain.mxml的橙色部分则是它的使用方法.
和不用接口不一样的地方是: var iOuter:IOuterModular = mdOuterWithInterface.child as IOuterModular;新建一个实体,此实体正是ModularLoader的child.这里可能要注意一下, 这个child可能是Flex的Bug,这个child是一个DisplayObject,例如我们这样写 mdOuterModular.child.SomeFunction().编译无法通过,提示是DisplayObject没有这个方法(废话).但是 在调试模式下可以看到,这个child并非一个DisplayObject. 因此很郁闷,必须把这个child 设置成Object才能执行里面的方 法.
用接口还有一个好处,那就是可以直接看到Modular中的方法和属性.而在前两个例子中是没有这种功能的.
另一个要注意的地方是, 如果我们的Modular的Width,Height设置成的是100%, 而在ModularLoader中设置了Width和Height为绝对值的 时候,会发现,事实上,Modular并没有填充这个固定区域! 做实验的话可以在Modular中设置一个Canvas.引用后会发现大小是0×0.所 以我们可能在写这种高宽不定的时候,可能要建立一个方法,在Modular Ready后执行方法来重设置它的大小.
现在我们可以看到程序可以正常的被执行了,但是Modular生成出来的swf个个都是100多K! 当然,因为我们还没有对 Modulars Project进行裁剪尺寸. 这个裁减过程的原理就是我们的主程序中已经编译了的类,在Modular中就不再编译了.而如何设置 呢?在Shell的Project中的编译器的附加参数里设置为-locale en_US -link-report=d: /testreport.xml 这样在编译的时候会生成一个关于Shell里所引用过的类库列表在d:/testreport.xml的文件中. 在 Modulars中的编译器的附加参数里设置为-locale en_US -load-externs=d:/testreport.xml 这样,在 编译Modulars的时候,载入Shell已经编译过的类库.在编译的时候就跳过这些类库.再编译一看,大小豁然小了100K,变成了10多k.


自我总结：
2、当项目涉及到很多模块的时候，往往想将这些模块放到一个src下的某一个文件夹中，但这时会出现一个问题。程序要用到模块，就需要在工程的Properties中将 模块文件作为"Applications"。但当模块文件并不在src的直接目录下，而在它的子目录里时，无法进行“工程的Properties中将 模块文件作为"Applications"”这项操作（或许是有的，但我还没找到），这个时候我们可以将模块文件放到src的直接目录下，进行正确的操作生成 相应的swf和xml文件，再模块文件移到src的子目录里，将swf和xml文件移到bin-debug文件相应的目录里，但是如果以后我们再对模块文件进行更改，swf文件并不会更新内部的数据，所以我想肯定有方法可以解决这个问题的，明天去问下别人。补充：凡是程序中要用到的.swf文件都在bin-debug目录下，有时候当我们加载swf文件出错，或者是没有加载进来的时候，不妨去bin-debug目录下去看看，是否已经编译好了我们要的SWF文件，或者是运行一下那个swf文件，看究竟是SWF文件本身的问题还是其他方面的逻辑问题。

3、单例模式真的很好用，真的～特别是对自定义的事件发送和侦听，比如，在多个类进行数据通信的时候，我们使用单例的属性等进行数据传递等等操作……用起来很爽

4、疑问：天晓得是怎么一回事，为什么我明明就是一样的代码，为什么它就有两具不同的结果，上一次是异步弄得我崩溃是我活该，这次算什么，找不到mx.controls::Input？？？？这话不是这么说的，可这问题是出在<mx:TextInput text="bottom" />上就这么短短的一句，能异步？？结果，到最后，我重新把这句话一字不漏的打一遍，还是有问题，我把它给删了，再在另一个程序里把那句话源源本本的拷进去，没有出错，我再拷进来，结果就让我晕得不能再晕，，，，，，这是为什么？？？手误？？？这事感觉不是第一次出现，好像有好几次了，有一次新建一个工程，把有无法运行或有错误的代码程序再一字不漏得拷过来，结果就好了，天啦～～～