Flex4第一记

1<?xml version="1.0" encoding="utf-8"?>

2<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">

3<s:layout>

4<s:VerticalLayout paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5" />

5</s:layout>

6<fx:Declarations>

7<s:Fade id="myFade" duration="1000" alphaFrom="1.0" alphaTo="0.0" />

8<s:Fade id="myFade1" duration="1000" alphaFrom="0.0" alphaTo="1.0" />

9</fx:Declarations>

10<fx:Style source="../css/style02.css" />

11<fx:Script source="../as/script02.as" />


12<s:Panel title="showPanel" id="myPanel" x="8" y="6" width="600" height="400" hideEffect="{myFade}" showEffect="{myFade1}" visible="true" >

13<s:layout>

14<s:VerticalLayout paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5" />

15</s:layout>

16<mx:Text text="姓名" />

17<s:TextInput id="name1" text="" />

18<mx:Text text="密码" />

19<s:TextInput id="password" text="" />

20<mx:Text text="确认密码" />

21<s:TextInput id="rePassword" text="{password.text}" editable="false" />

22<mx:Text text="用户信息" />

23<s:TextArea id="info" text="" />

24<s:Button id="button" label="copy that" click="textCopy();" />

25</s:Panel>

26<s:Button id="button1" label="showorhide" click="change();" />

27</s:Application>

总结下

开头2行固定格式，定义xml版本，定义flex应用程序及相关的命名空间，也就是导入包。fx、s、mx为前缀等号后面为URI。

3-5行下面为应用程序的布局，flex4需要单独布局，不能像flex3直接在应用程序里布局。而且有布局范围在哪个容器里就只针对某个容器。

6-9行为两个显示和隐藏时的效果，特别注意的是flex4需要放到声明里才能用。

7-8为两个渐进的效果，duration是周期以毫秒计，alphaFrom和alphaTo是指透明度，1.0为不透明。

10-11行为引用的外部样式文件和as文件，注意引用路径是以src为根目录的。

12-25为一个panel容器，我在此容器上添加了两个显示和隐藏时的效果，同时由visible属性控制触发这两个效果。

13-15行对panel单独加了布局，只为测试用没有实际意义。

21行直接将password的内容动态绑定到repassword上，包括24行，在flex里都是直接对控件的id进行操作的。

今天就记这些了。