flex基础学习

Flex是Adobe开发的一种RIA，富互联网应用，用Flex开发的东西均可以使用Flash作出来，可是Flex主要是面向的程序开发人员，前台使用ActionScript和MXML。

上面介绍了flex是什么，下面针对flex项目本身写一下本身的认识。ActionScript相似于web开发的javascript，不过他的语法有强类型int，string等,mxml他相似于web中的html中的标签。二者结合能够很好的将代码分离开来。

对于mxml来讲<mx:Application 中Application至关于舞台的更节点就像html中的html为根节点同样。其余向<mx:TitleWindow等容器都是在Application的节点上创建的，不然界面是没法展示的这个我是深有体会。

对于ActionScript.as文件能够认为他里面主要就是对命名空间的导入和一些定义函数，类在里面。

flex开发我的理解也是基于事件驱动来渲染界面的。

flex加载模块的组件能够用ModuleLoader来加载，此类继承自vbox。vbox是垂直布局，hbox为水平布局。

对于flex远程交互，项目中主要用到的是RemoteObject此对象来进行交互的，不过对于返回的结果接受要用两个函数来接受， addEventListener(ResultEvent.RESULT,pOnOk);addEventListener(FaultEvent.FAULT,pOnEr);一个是用来监听成功，一个是用来监听失败。这一点与ajax调用很类似。

flex的开发给个人我的感受有点像Extjs，不少地方都须要注册事件，而后将方法注册进去。

下面给贴出一段代码登陆界面与总体界面布局的

登陆界面代码以下：

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
	horizontalScrollPolicy="auto" verticalScrollPolicy="auto" title="登陆" height="200" width="400"
	showCloseButton="false" creationComplete="init()" >
	<mx:Script source="Login_As.as" />
	<mx:Label x="47" y="37" text="登陆名称" />
	<mx:Label x="47" y="70" text="登陆密码"/>
	<mx:TextInput x="107" y="35" width="218" id="tbox_userName" text="" maxChars="10" enter="Logins()"
		restrict="a-zA-Z0-9"/>
	<mx:TextInput x="107" y="69" width="218" id="tbox_password" text="" displayAsPassword="true" maxChars="25"
		enter="Logins()"/>
	<mx:Button id="btnLogin" x="271" y="104" label="登 录"/>
</mx:TitleWindow>

 总体模板布局以下：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
	horizontalScrollPolicy="off" verticalScrollPolicy="off" 
	paddingTop="0" paddingLeft="0" paddingRight="0" paddingBottom="0"
	layout="absolute" creationComplete="init()" themeColor="#ffffff" backgroundColor="#ffffff">
	<mx:Script source="Index_As.as" />
	<mx:Style source="style.css"/>
	<mx:VBox id="controls" width="100%" height="100%" horizontalGap="0" verticalGap="0"  backgroundColor="#ffffff">
		<mx:HBox styleName="TitleBar" id="idTitleBar" width="100%" height="32" paddingTop="2" backgroundColor="#eaeaea">
			<mx:Label id="idTitle" fontSize="18" text="XXXX业务管理系统"/>
			<mx:Label id="idAreaName" verticalCenter="0" fontSize="18" text=""/>
		</mx:HBox>
		<mx:Canvas id="idOperBar" width="100%" height="24" x="2" y="-5">
			<mx:Label id="lbAgentInfo" left="10" verticalCenter="0" text="" />
		</mx:Canvas>
		<mx:VBox id="vbox_middle" width="100%" height="100%">
			<mx:HDividedBox id="HDBox" width="100%" height="100%" paddingLeft="5" paddingBottom="5" paddingRight="5">
				<mx:VBox id="vbox_menu" width="200" height="100%" borderColor="#aaaaaa" borderStyle="solid">
					<mx:Tree id="tree_menu" width="100%" height="100%" verticalScrollPolicy="auto" 
							horizontalScrollPolicy="auto" borderStyle="none" openItems="true" scroll="true"/>
				</mx:VBox>
				<mx:VBox id="vbox_content" width="100%" height="100%" borderColor="#aaaaaa" borderStyle="solid">
					<mx:ApplicationControlBar id="idModuleNameBar" width="100%">
						<mx:Label id="idModuleName" text="" fontWeight="bold"/>
					</mx:ApplicationControlBar>
					<mx:ModuleLoader id="MLoader" url="desktop.swf" width="100%" height="100%" verticalScrollPolicy="off" horizontalScrollPolicy="off"/>
				</mx:VBox>
			</mx:HDividedBox>
		</mx:VBox>	
		
	</mx:VBox>
</mx:Application>

 具体flex里面某个组件干什么用的，这里就不详细写了。