两年前用过FLEX,那时候的FLEX BUILDER已经不叫了,改名后意味深长——FLASH BUILDER。 Flex简单快速,出来的样子比单纯HTML,JSP等等好看的多。内种现代感的感觉不容易啊。 他的语言非常简单,基本就是顺手就能用。XML标签,如HTML般改属性,混杂一点actionscript,比较像JSP. FLEX主攻前端,后端架构就随便选了。可与 ASP.NET, XFIRE , SILVER等。只用过ASP.NET,交互及其容易。 内些控件如.NET一样,内置的。扩展多多。 下面是转载来的一个简单的FLEX开头。 Flex学习记录(一)——MXML基本知识 我们使用两种语言来编写Flex程序:MXML和ActionScript。MXML是用来布局用户界面组件的XML标识语言,我们也可以使用MXML来定义一个程序的不可见部分,例如:到服务器数据源的访问以及用户界面组件和服务器数据源的数据绑定。 一.简单的MXML 新建一个HellowWorld.mxml文件,并拷贝下面的内容,看一下运行结果。 <?xml version="1.0"?><!-- mxml\HellowWorld.mxml --><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark"> <s:layout> <s:VerticalLayout/> </s:layout> <s:Panel title="My Application"> <s:Label text="Hello World" fontWeight="bold" fontSize="24"/> </s:Panel></s:Application> 这是一个最简单的MXML程序,从这个例子,我们可以学到如下几点: <s:property> <s:propertytype> ...用property的形式列出属性对象里面的各个变量 </s:propertytype></s:property>1.<s:Application>是一个程序的root tag,代表一个Spark应用容器。一个项目应该只有一个root tag. 2.xmlns:fx="http://ns.adobe.com/mxml/2009是ActionScript元素所在的命名空间 xmlns:mx="library://ns.adobe.com/flex/mx是MX控件集所在的命名空间 xmlns:s="library://ns.adobe.com/flex/spark是Spark控件集所在的命名空间 MX和Spark控件集有很多相同的控件,Spark是为Flex4新出的,尽量使用Spark控件集中的控件,在Spark控件集里没有相应的控件时再用MX控件集的控件 3.MXML中的每个tag都和ActionScript中的类或属性对应,ActionScript中的类在MXML中用节点表示,属性可以用attribute表示,也可以用property表示。比如Panel和Label都是Spark控件集中的类。text,fontSize等都是Label类的属性 4.MXML的文件名不能和ActionScript里面的类和控件名相同,不能和MXML里的tag相同,也不能是application,且后缀必须是小写的mxml。 二.MXML中属性的赋值 MXML中的属性可以用attribute表示,也可以用property表示。如果属性的类型是简单的类型,用两种方式都能表示,如果是复杂的类型,则只能用属性的方式表示,其通用格式如下: 下面对于几种常见的复杂类型,举例说明一下 1.MXML中数组的表示 MXML中可以用tag<fx:Array>和</fx:Array>来表示一个数组,且该tag可以省略。 <mynamespace:nameOfObjectProperty> <fx:Array> <fx:Number>94062</fx:Number> <fx:Number>14850</fx:Number> <fx:Number>53402</fx:Number> </fx:Array></mynamespace:nameOfObjectProperty> 2.MXML中Vector的表示 <fx:Declarations> <fx:Vector type="String"> <fx:String>one</fx:String> <fx:String>two</fx:String> <fx:String>three</fx:String> </fx:Vector></fx:Declarations> 3.MXML中XML对象的表示 <mynamespace:value xmlns:a="http://www.example.com/myschema"> <fx:XML> <a:purchaseorder> <a:billingaddress> ... </a:billingaddress> </a:purchaseorder> </fx:XML></mynamespace:value> 4.MXML中property的值可以用{静态变量}表示,也可以直接用常量表示。例如下面两种方式都可以 5.MXML中用\来转义特殊字符,用{\n}或
来表示换行符,用<String>来表示<String> 三.定制Application的外观 1.控件库里有一些容器控件,可以进行控制应用的外观,比如HGroup和VGroup控制控件的排列方式,TabNavigator添加Tab查看方式等 2.用CSS控制外观,需要用<fx:Style>tag来包含CSS的定义,且该定义必须是root tag的子节点。 <?xml version="1.0"?><!-- mxml/CSSExample.mxml --><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark"> <fx:Style> @namespace s "library://ns.adobe.com/flex/spark"; @namespace mx "library://ns.adobe.com/flex/mx"; /* class selector */ .myClass { color: Red } /* type selector */ s|Button { font-size: 18pt } </fx:Style> <s:Panel title="My Application"> <s:Button styleName="myClass" label="This is red 18 point text."/> </s:Panel></s:Application> 3.用skin控制控件外观 <s:Button skinClass="com.mycompany.skins.MyButtonSkin" /> 四.ActionScript和MXML的交互 1.在MXML的事件中可以用简单的ActionScript语句 <s:Button label="Click Me" click="textarea1.text='Hello World';" /> 2.在MXML中插入ActionScript语句 <fx:Script> <![CDATA[ public var s:Boolean; public function doSomething():void { // The following statements must be inside a function. s = label1.visible; label1.text = "label1.visible = " + String(s); } ]]></fx:Script><fx:Script source="includes/IncludedFile.as"/> 3.使用{}进行数据绑定 <fx:Script> <![CDATA[ [Bindable] public var myText:String = "Display" + "\n" + "Content"; ]]></fx:Script><s:TextArea width="100%" text="{myText}"/> 4.对MXML中的tag增加id attribute,这样可以在ActionScript语句中直接访问该对象。 5.用ActionScript创建可以在MXML中使用的控件。 <?xml version="1.0"?><!-- mxml/CustomMXMLComponent.mxml --><s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:MyComps="myComponents.boxes.*"> <s:Panel title="My Application" height="150"> <MyComps:MyComboBox/> </s:Panel></s:Application> 注:文中给出的例子均来自adobe 作者:Jingle Guo 出处:http://www.cnblogs.com/studynote/ 若标题中有“转载”字样,则本文版权归原作者所有。若无转载字样,本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利. |
[技术| 编程·课件·Linux] FLEX 简单快速高效 + 3D
Castelo
· 发布于 2013-03-31 10:32
· 1294 次阅读
转载文章时务必注明原作者及原始链接,并注明「发表于 软院网 RuanYuan.Net 」,并不得对作品进行修改。