flex学习----states和transitions

关于states

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical"> <mx:Script> <![CDATA[ import mx.effects.easing.Bounce; ]]> </mx:Script> <mx:states> <mx:State name="bookDetails" basedOn=""> <!--relativeTo 向已创建的容器bookForm中添加容器 relativeTo不解?--> <!--creationPolicy属性决定子容器什么时候创建。默认auto值当状态被激活时容器创建了。all值，当程序开始被创建了。none值直到一个函数createInstance()被调用时才会被创建。--> <mx:AddChild relativeTo="{bookForm}" position="lastChild" creationPolicy="all"> <mx:FormItem label="ISBN:121212222" id="isbn"/> </mx:AddChild> <mx:SetProperty target="{panel1}" name="title" value="bookDetails"/> <mx:RemoveChild target="{bookLink}"/> <mx:AddChild relativeTo="{spacer1}" position="before"> <mx:LinkButton label="Collapse Book Details" click="currentState=''"/> </mx:AddChild> </mx:State> </mx:states> <mx:transitions> <!--在项目代码中通过使用星号(*)，你就告诉Flex当从任何一个状态切换到任何其它状态时就可以使用这个转换--> <mx:Transition fromState="*" toState="*"> <!--使用转换，可以选择一起同时执行，或者依次执行，通过Parallel类让它们平行执行--> <mx:Parallel targets="{[book, bookLink, title, isbn]}"> <!--指定组件要执行的动作。可以选择Resize或Move类--> <!--第一个属性是duration。它决定resize转换维持多长时间完成。它的计数单位是毫秒，因此5000毫米就是5秒。--> <!--easingFunction属性改变转变动画的速度,转换将持续5秒（5000毫秒），以弹跳方式结束，开始快然后慢--> <mx:Resize duration="5000" easingFunction="Bounce.easeOut"/> <!--让这两个动画依次执行--> <mx:Sequence target="{isbn}"> <!--Blur类:先将对象变模糊，然后变清晰--> <mx:Blur duration="2000" blurYFrom="0.0" blurYTo="20.0"/> <mx:Blur duration="2000" blurYFrom="20.0" blurYTo="0.0"/> </mx:Sequence> </mx:Parallel> </mx:Transition> </mx:transitions> <!--horizontalScrollPolicy和verticalScrollPolicy auto值会在需要的时候将滚动条切换为on。off或on值将使它们处于off或on状态--> <mx:Panel title="XML Book" horizontalScrollPolicy= "off" verticalScrollPolicy="off" id="panel1"> <mx:Form id="bookForm"> <mx:FormItem label="Foundation XML for Flash" fontWeight="bold" id="book"/> <mx:FormItem label="Sas Jacobs" fontStyle="italic" id="title"/> </mx:Form> </mx:Panel> <mx:ControlBar> <mx:LinkButton label="submit" id="bookLink" click="currentState='bookDetails'"/> <!--你想在LinkButton和Label控制器之间留几个空格。那你就需要调用Flex中的Spacer类了。 首先父容器的size要成为变量，Spacer类有一个number属性用来设置height，width，最大height和width， 最小height和width，height和width的百分比等等。--> <mx:Spacer width="100%" id="spacer1"/> <mx:Label text="Title" /> </mx:ControlBar> </mx:Application>

relativeTo 关联的位置有疑问，不知道是与关联的容器是包含还是什么其他的关系