flex入门一

flex入门1
1，flex有两部分语言构成：mxml,ActionScript.
2，初学者可以认为 mxml=html  actionscript=javascript;
3，开发flex快速查阅apid的方式：
   打开动态帮助窗口，鼠标放在那个组件代码上，动态帮助窗口自动显示该组件的超链接。
   悬停帮助：鼠标停留在某个组件代码上一会儿就会弹出帮助层。
   shift+
3，javascript的事件处理机制和Actionscript的机会相同：主要区别在于ActionScript的事件处理机制还提供了一个事件对象。
   在ActionScript中，所有的事件都发端于一个通用的事件对象，事件通过继承添加其他详细信息。有了事件对象，就能轻松编写出具有高度可重用性的事件处理程序，因为事件处理程序可以从事件对象中获得事件的详细信息包括：
     1，事件的来源   clickEvelt.cameFrom
     2,数据的引用。
     3，事件的类型（例如是鼠标单击还是鼠标进入）
注意：CDATA标签的使用：
      由于mxml文件符合xml标准，因此必须遵循xml的规则。cdata在这里告诉flex builder方括号中的内容原样不动，不作为xml代码处理，如果不使用cdata那么如果出现大于，小于等符号flex会认为是标签的结束，所以始终把Actionscript代码放进cdata中是明智的选择。
   下面是实例：

    <?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="955" minHeight="600"><fx:Declarations><!-- 将非可视元素（例如服务、值对象）放在此处 --></fx:Declarations><!--类似javascript的Actionscript--><fx:Script><![CDATA[import mx.controls.Alert;public function clickHandler(clickEvent:Event):void{  Alert.show("Event Type:" + clickEvent.type +             " came from:" + clickEvent.currentTarget.id);}]]></fx:Script><!--Mxml文件中添加的一切都可成为组建，像button这种可以看得见的组建又叫做控件--><s:Panel x="84" y="86" width="367" height="211"><s:Button id="me" label="Hello World!" fontSize="40" x="0" y="0" click="clickHandler(event)"/></s:Panel></s:Application>

2，调用函数

<?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="955" minHeight="600"><s:layout><s:BasicLayout/></s:layout><fx:Declarations><!-- 将非可视元素（例如服务、值对象）放在此处 --></fx:Declarations><fx:Script><![CDATA[import mx.controls.Alert;public function textMerge(input1:String,input2:String):String{var x:String = input1 + input2;return x;}]]></fx:Script><s:Group><s:layout><s:HorizontalLayout/></s:layout><s:TextInput id="value1"/><s:Label text="and"/><s:TextInput id="value2"/><s:Button label="Join the two"  click="Alert.show(textMerge(value1.text,value2.text))"/></s:Group></s:Application>

3，把Actionscript代码放进一个单独的文件中
   创建myFunctions.as文件内容如下：

   // ActionScript filepublic function textMerge(input1:String,input2:String):String{    var x = input1 + input2;return x;}

   创建mxml文件并包含上面的Actionscript文件：

   <?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="955" minHeight="600"><s:layout><s:BasicLayout/></s:layout><fx:Declarations><!-- 将非可视元素（例如服务、值对象）放在此处 --></fx:Declarations><fx:Script source="myFunctions.as"></fx:Script><fx:Script><![CDATA[import mx.controls.Alert;]]></fx:Script><s:Group><s:layout><s:HorizontalLayout/></s:layout><s:TextInput id="value1"/><s:Label text="and"/><s:TextInput id="value2"/><s:Button label="Join the two"  click="Alert.show(textMerge(value1.text,value2.text))"/></s:Group></s:Application>

查看更多 下一篇