transition_practice.mxml

Java界面解决方案。使用FLEX和后台数据库通讯。完美界面效果。可作为BS系统的参考。

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

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>

<![CDATA[

import mx.effects.easing.Bounce;

]]>
</mx:Script>
	<mx:states>
		<mx:State name="bookDetails">
			<mx:SetProperty target="{bookForm}" name="height" value="105"/>
			<mx:SetProperty target="{book}" name="width" value="245"/>
			<mx:SetProperty target="{book}" name="height" value="208"/>
			<mx:SetProperty target="{bookForm}" name="width" value="212"/>
			<mx:SetProperty target="{book}" name="title" value="Book Details"/>
			<mx:SetProperty target="{title}" name="text" value="Book Details"/>
			<mx:RemoveChild target="{bookLink}"/>
			<mx:AddChild relativeTo="{spacer1}" position="before" >
				<mx:LinkButton label="Collapse Book Details" click="currentState = ''"/>
			</mx:AddChild>
			<mx:AddChild relativeTo="{bookForm}" position="lastChild" creationPolicy="all">
				<mx:FormItem id="isbn" label="ISBN: 1590595432">
				</mx:FormItem>
			</mx:AddChild>
		</mx:State>
	</mx:states>
	
    <mx:transitions>

      <mx:Transition fromState="*" toState="*">

         <mx:Parallel targets="{[book, bookLink, title, isbn]}">

            <mx:Resize duration="800" easingFunction="Bounce.easeOut"/>

            <mx:Sequence target="{isbn}">

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

<mx:Panel title="XML Book" id="book" horizontalScrollPolicy= "off" verticalScrollPolicy="off" width="233" height="198">

<mx:Form id="bookForm">
<mx:FormItem label="Foundation XML for Flash" fontWeight="bold" id="formitem1"/>
<mx:FormItem label="Sas Jacobs" fontStyle="italic"/>
</mx:Form>
	<mx:ControlBar height="35">
		<mx:LinkButton label="LinkButton" id="bookLink" click="currentState = 'bookDetails' "/>
		<mx:Spacer width="100%" id="spacer1"/>
		<mx:Label text="Book Title" id="title"/>
	</mx:ControlBar>

</mx:Panel>

</mx:Application>