| 패키지 | mx.states |
| 클래스 | public class Transition |
| 상속 | Transition  Object |
| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
To define a transition, you set the transitions property of an Application
to an Array of Transition objects.
You use the toState and fromState properties of
the Transition class to specify the state changes that trigger the transition.
By default, both the fromState and toState properties
are set to "*", meaning apply the transition to any changes to the view state.
You can use the fromState property to explicitly specify a
view state that your are changing from, and the toState property
to explicitly specify a view state that you are changing to.
If a state change matches two transitions, the toState property
takes precedence over the fromState property. If more than one
transition match, Flex uses the first definition in the transition array.
You use the effect property to specify the Effect object to play
when you apply the transition. Typically, this is a composite effect object,
such as the Parallel or Sequence effect, that contains multiple effects,
as the following example shows:
<mx:Transition id="myTransition" fromState="*" toState="*">
<mx:Parallel>
...
</mx:Parallel>
</mx:Transition>
MXML 구문
MXML 구문 표시
MXML 구문 숨기기The <mx:Transition> tag
defines the following attributes:
<mx:Transition
Properties
id="ID"
effect=""
fromState="*"
toState="*"
autoReverse="false"
/>
기본 MXML 속성effect
기타 예제
Defining transitions
Transition tips and troubleshooting
Example: Creating a transition effect
관련 API 요소
mx.effects.RemoveChildAction
mx.effects.SetPropertyAction
mx.effects.SetStyleAction
| 속성 | 정의 주체 | ||
|---|---|---|---|
| autoReverse : Boolean = false
Set to true to specify that this transition applies
to both the forward and reverse view state changes. | Transition | ||
 | constructor : Object
지정된 객체 인스턴스의 클래스 객체 또는 생성자 함수에 대한 참조입니다. | Object | |
| effect : IEffect
The IEffect object to play when you apply the transition. | Transition | ||
| fromState : String = "*"
A String specifying the view state that your are changing from when
you apply the transition. | Transition | ||
| interruptionBehavior : String = "end"
Flex does not support the playing of multiple transitions simultaneously. | Transition | ||
| toState : String = "*"
A String specifying the view state that you are changing to when
you apply the transition. | Transition | ||
| 메서드 | 정의 주체 | ||
|---|---|---|---|
Constructor. | Transition | ||
|
지정된 속성이 객체에 정의되어 있는지 여부를 나타냅니다. | Object | |
|
Object 클래스의 인스턴스가 매개 변수로 지정된 객체의 프로토타입 체인에 있는지 여부를 나타냅니다. | Object | |
|
지정된 속성이 존재하고 열거 가능한지 여부를 나타냅니다. | Object | |
|
루프 작업에서 동적 속성을 사용할 수 있는지 여부를 설정합니다. | Object | |
|
로캘별 규칙에 따라 서식이 지정된 이 객체의 문자열 표현을 반환합니다. | Object | |
|
지정된 객체의 문자열 표현을 반환합니다. | Object | |
|
지정된 객체의 프리미티브 값을 반환합니다. | Object | |
autoReverse | 속성 |
public var autoReverse:Boolean = false| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
Set to true to specify that this transition applies
to both the forward and reverse view state changes.
Therefore, use this transition on a change from view state A to
view state B, and on the change from B to A.
While the transition from view state A to view state B is playing,
the reverse transition can occur to interrupt the current transition.
The reverse transition always halts the current transition at
its current location.
That is, the reverse transition always plays as if
the interruptionBehavior property was set to stop,
regardless of the real value of interruptionBehavior.
This property is only checked when the new transition is going in the exact opposite direction of the currently playing one. That is, if a transition is playing between states A and B and then a transition to return to A is started.
If a transition uses the toState and fromState
properties to explicitly handle the transition from view state B to A,
then Flex ignores the autoReverse property.
기본값: false.
관련 API 요소
effect | 속성 |
public var effect:IEffect| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
The IEffect object to play when you apply the transition. Typically, this is a composite effect object, such as the Parallel or Sequence effect, that contains multiple effects.
The effect property is the default property of the
Transition class. You can omit the <mx:effect> tag
if you use MXML tag syntax.
fromState | 속성 |
public var fromState:String = "*"| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
A String specifying the view state that your are changing from when you apply the transition. The default value is "*", meaning any view state.
You can set this property to an empty string, "", which corresponds to the base view state.
기본값: "*".
interruptionBehavior | 속성 |
public var interruptionBehavior:String = "end"| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 4.5 |
| 런타임 버전: | Flash Player 10.2, AIR 2.5 |
Flex does not support the playing of multiple transitions simultaneously. If a transition is currently playing when a new transition occurs, the current transition is interrupted. This property controls how the current transition behaves when interrupted.
By default, the current transition ends, which snaps all effects in
the transition to their end values.
This corresponds to a property value of end.
If the value of this property is stop, the current transition
halts at its current location.
The new transition start playing from the halt location of
the previous transition.
The value of stop can smooth out the appearance of an
interrupted transition.
That is because the user does not see the current transition snap
to its end state before the new transition begins.
In some cases, the interrupting transition can be the reverse of
the current transition.
For example, while the transition from view state A to view state B
is playing, the reverse transition occurs to interrupt the current transition.
If you set the autoReverse property of a transition instance
to true, you can use the same transition to handle both
the forward and reverse transitions.
When the interrupting transition is the reverse transition of the
current transition and has autoReverse set to true,
the interrupting transition runs as if the
interruptionBehavior property was set to stop,
regardless of the real value of interruptionBehavior.
The mx.states.InterruptionBehavior class defines the possible values for this property.
기본값: end.
관련 API 요소
toState | 속성 |
public var toState:String = "*"| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
A String specifying the view state that you are changing to when you apply the transition. The default value is "*", meaning any view state.
You can set this property to an empty string, "", which corresponds to the base view state.
기본값: "*".
Transition | () | 생성자 |
public function Transition()| 언어 버전: | ActionScript 3.0 |
| 제품 버전: | Flex 3 |
| 런타임 버전: | Flash Player 9, AIR 1.1 |
Constructor.
<?xml version="1.0" ?>
<!-- Simple example to demonstrate the Transition class. -->
<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" currentState="Login">
<!-- Define the view states -->
<s:states>
<s:State name="Login" />
<s:State name="Register" />
</s:states>
<s:transitions>
<!-- Define the transition from the base state to the Register state.-->
<s:Transition id="toRegister" fromState="*" toState="Register">
<s:Sequence targets="{[loginPanel, registerLink, confirm, loginLink]}">
<s:RemoveAction />
<s:Fade />
<s:SetAction target="{loginPanel}" property="title" />
<s:SetAction target="{loginButton}" property="label" />
<s:SetAction target="{loginButton}" property="color" />
<s:Resize target="{loginPanel}"/>
<s:AddAction />
<s:Fade />
</s:Sequence>
</s:Transition>
<!-- Define the transition from the Register state to the base state.-->
<s:Transition id="toDefault" fromState="Register" toState="*">
<s:Sequence targets="{[loginPanel, registerLink,
confirm, loginLink]}">
<s:RemoveAction/>
<s:SetAction target="{loginPanel}" property="title"/>
<s:SetAction target="{loginButton}" property="label"/>
<s:SetAction target="{loginButton}" property="color"/>
<s:Resize target="{loginPanel}"/>
<s:AddAction/>
</s:Sequence>
</s:Transition>
</s:transitions>
<!-- Define a Panel container that defines the login form. The title of the Panel
changes depending on the state. -->
<s:Panel title="Login" title.Register="Register" id="loginPanel"
width="75%" horizontalCenter="0" verticalCenter="0">
<s:controlBarLayout >
<s:BasicLayout />
</s:controlBarLayout>
<s:layout>
<s:VerticalLayout paddingTop="10" paddingBottom="10" paddingRight="10" paddingLeft="10" />
</s:layout>
<s:Label color="blue" width="100%"
text="Click the 'Need to Register?' link to change state. Click the 'Return to Login' link to return to the base state."/>
<!-- The following form has two TextInputs in the Login state and three TextInputs
in the Register state. -->
<s:Form id="loginForm" >
<s:FormItem label="Username:">
<s:TextInput/>
</s:FormItem>
<s:FormItem label="Password:">
<s:TextInput/>
</s:FormItem>
<s:FormItem id="confirm" label="Confirm:" includeIn="Register" includeInLayout="false" includeInLayout.Register="true">
<s:TextInput/>
</s:FormItem>
</s:Form>
<!-- The controlBar includes two visible items in each state. Which LinkButton is visible is determined
by the state -->
<s:controlBarContent>
<mx:LinkButton id="registerLink" label="Need to Register?" top="10" bottom="10"
click="currentState='Register'" left="10" includeIn="Login" />
<mx:LinkButton id="loginLink" label="Return to Login" click="currentState=''" includeIn="Register" left="10" top="10" bottom="10"/>
<s:Button label="Login" label.Register="Register" id="loginButton" right="10" color.Register="0x0000FF" top="10" bottom="10"/>
</s:controlBarContent>
</s:Panel>
</s:Application>
Tue Jun 12 2018, 03:17 PM Z