XML 및 fl.motion 패키지의 ActionScript 클래스를 사용하여 모션 트윈을 작성할 수 있습니다. Adobe Flash Professional의 "ActionScript로 모션 복사" 명령을 통해 타임라인에서 모션 트윈에 기반한 XML 및 ActionScript를 생성하여 다른 심볼이나 다른 프로젝트에 사용할 수 있습니다. 또한 모션 트윈을 직접 작성할 수도 있습니다. 컴파일 타임에 fl.motion 클래스가 클래스 경로에 있는 경우 지정된 표시 객체에 모션 트윈이 적용됩니다. motion 클래스에 대한 자세한 내용은 fl.motion 패키지를 참조하십시오. 지원하는 XML의 각 요소는 Adobe Flash Platform용 ActionScript 3.0 참조 설명서의 클래스 및 속성에 해당합니다.
© 2015 Adobe Systems Incorporated. All rights reserved.
Tue Jun 12 2018, 03:34 PM Z
XML 요소의 계층 구조는 다음과 같습니다.
<Motion>
<Source>
<dimensions/>
<geom:Rectangle />
</dimensions>
<transformationPoint>
<geom:Point />
</transformationPoint>
</Source>
<Keyframe>
<color>
<Color />
</color>
<tweens>
<SimpleEase />
<CustomEase>
<BezierControl />
<BezierNode />
</CustomEase>
</tweens>
<filters>
<filters />
</filters>
</Keyframe>
</Motion>다음 표에는 모션 객체에 지정할 수 있는 XML 요소 및 특성이 간략히 요약되어 있습니다. 각 항목에 대한 세부 사항은 각 요소에 해당하는 클래스에 나열되어 있는 속성을 참조하십시오.
| 요소 | 특성 | 유형 | 설명 |
|---|---|---|---|
| Motion | Flash에서 모션 트윈을 특징 지우는 속성을 지정할 수 있도록 모션 인스턴스를 정의합니다. fl.motion.Motion 클래스를 참조하십시오. | ||
| duration | Number | 선택한 모션 트윈의 프레임 수입니다. fl.motion.MotionBase.duration 속성을 참조하십시오. | |
| source | 모션과 연결된 원래 시각적 객체의 속성을 포함합니다. fl.motion.Source 클래스를 참조하십시오. | ||
| Source | frameRate | Number | Flash Professional에서 복사한 원래 애니메이션이 포함된 SWF 파일에 대한 초당 프레임(fps) 설정입니다. 다른 SWF 파일에서 ActionScript를 구현하는 경우 이 값은 아무런 영향을 미치지 않습니다. fl.motion.Source.frameRate 속성을 참조하십시오. |
| x | Number | Flash Professional에서 복사한 원본 모션 트윈이 시작될 때 표시되는 심볼 인스턴스 변형점의 x 좌표입니다. | |
| y | Number | Flash Professional에서 복사한 원본 모션 트윈이 시작될 때 표시되는 심볼 인스턴스 변형점의 y 좌표입니다. | |
| scaleX | Number | 가로 크기 비율을 나타내는 소수 값입니다. 이 값은 보통 0과 1사이의 값이지만 1보다 크거나 0보다 작을 수도 있습니다. 예를 들어 scaleX를 -1로 설정하여 객체를 뒤집거나 3으로 설정하여 원래 크기의 3배로 만들 수 있습니다. | |
| skewX | Number | 수직 축에 따른 시어링 각도(도)입니다. skewX 및 skewY 값이 같은 경우 rotation 특성이 대신 사용됩니다. | |
| skewY | Number | 수직 축에 따른 시어링 각도(도)입니다. skewX 및 skewY 값이 같은 경우 rotation 특성이 대신 사용됩니다. | |
| rotation | Number | 최초 프레임의 회전 각도입니다. | |
| elementType | String | 모션 트윈에 사용되는 시각적 객체의 유형입니다. "movie clip", "button", "graphic", "rectangle object", "oval object", "drawing object", "group", "bitmap", "compiled clip", "video" 또는 "text" 값을 사용할 수 있습니다. | |
| symbolName | String | Adobe Flash Professional 문서의 라이브러리에 심볼이 있는 경우 해당 심볼의 이름입니다. 원래의 시각적 객체가 심볼 인스턴스가 아닐 수도 있습니다. | |
| dimensions | 트위닝되는 심볼의 경계 상자와 변형점을 기술하는 geom 네임스페이스를 사용하는 태그를 포함합니다. | ||
| geom:Rectangle | flash.geom 패키지의 객체입니다. | flash.geom.Rectangle 객체의 속성에 대응하는 특성을 추가할 수 있습니다. 예를 들면 다음과 같습니다. <geom:Rectangle left="7" top="9" width="151.95" height="151.95" />top 및 left 값은 부모 객체의 등록 포인트를 기준으로 지정되는 값입니다. top 및 left는 부모 객체의 좌표 공간에서 정의됩니다. | |
| geom:Point | flash.geom 패키지의 객체입니다. | 변형점의 좌표는 경계 상자 크기(geom:Rectangle 요소의 값)의 비율로 정의됩니다. 변형점이 경계 상자의 왼쪽 위 모서리에 있으면 해당 좌표는 (0, 0)입니다. 변형점이 경계 상자의 오른쪽 아래 모서리에 있으면 해당 좌표는 (1, 1)입니다. 이러한 값을 사용하면 비율 및 등록 포인트가 다른 객체에 변형점을 일정하게 적용할 수 있습니다. 변형점은 경계 상자 바깥에 있을 수도 있습니다. 이 경우 좌표가 0보다 작거나 1보다 클 수 있습니다. | |
| Keyframe | 타임라인의 키프레임에 해당하는 정보가 포함됩니다. | ||
| blank | Boolean | 키프레임이 비어 있음을 나타냅니다. | |
| index | Number | 키프레임에 대한 고유한 정수 값입니다. 첫 번째 키프레임의 인덱스는 항상 0입니다. XML에서 키프레임은 인덱스 값의 오름차순으로 지정해야 합니다. | |
| label | String | 키프레임을 설명하는 문자열로서 타임라인의 프레임 레이블에 대응됩니다. | |
| tweenSync | Boolean | 동기화 설정이 켜지거나("true") 꺼지도록("false") 전환합니다. 동기화가 적용되면 트윈의 프레임 수를 다시 계산하여 타임라인에서 트윈에 할당된 프레임 수와 일치시킵니다. ActionScript에서 그래픽 심볼을 제어할 수 없으므로 이 특성은 ActionScript 애니메이션에 영향을 미치지 않습니다. 이 XML 특성은 Adobe Flash Professional의 [모션 복사] 및 [모션 붙여넣기] 명령에서만 사용됩니다. XML에서 이 특성을 생략하면 기본적으로 true로 설정됩니다. | |
| tweenSnap | Boolean | 물리기 설정이 켜지거나("true") 꺼지도록("false") 전환합니다. 물리기가 적용되면 심볼의 등록 포인트가 모션 경로에 연결됩니다. ActionScript에서 그래픽 심볼을 제어할 수 없으므로 이 특성은 ActionScript 애니메이션에 영향을 미치지 않습니다. 이 XML 특성은 Adobe Flash Professional의 [모션 복사] 및 [모션 붙여넣기] 명령에서만 사용됩니다. XML에서 이 특성을 생략하면 기본적으로 true로 설정됩니다. | |
| x | Number | 현재 프레임에서 심볼 인스턴스 중심점의 x 좌표입니다. | |
| y | Number | 현재 프레임에서 심볼 인스턴스 중심점의 y 좌표입니다. | |
| scaleX | Number | 0과 1사이의 소수 값으로 나타낸 가로 크기 비율입니다. 이 값은 보통 0과 1사이의 값이지만 1보다 크거나 0보다 작을 수도 있습니다. 예를 들어 scaleX를 -1로 설정하여 객체를 뒤집거나 3으로 설정하여 원래 크기의 3배로 만들 수 있습니다. | |
| scaleY | Number | 0과 1사이의 소수 값으로 나타낸 세로 크기 비율입니다. 이 값은 보통 0과 1사이의 값이지만 1보다 크거나 0보다 작을 수도 있습니다. 예를 들어 scaleY를 -1로 설정하여 객체를 뒤집거나 3으로 설정하여 원래 크기의 3배로 만들 수 있습니다. | |
| skewX | Number | 수직 축에 따른 시어링 각도(도)입니다. skewX 및 skewY 값이 같은 경우 rotation 특성이 대신 사용됩니다. | |
| skewY | Number | 수직 축에 따른 시어링 각도(도)입니다. skewX 및 skewY 값이 같은 경우 rotation 특성이 대신 사용됩니다. | |
| rotation | Number | 현재 프레임의 회전 각도입니다. | |
| rotateDirection | String | 트위닝된 요소의 회전 방법을 지정합니다. "auto", "none", "cw" 또는 "ccw"로 지정할 수 있습니다. XML에서 이 특성을 생략하면 기본적으로 "auto"로 지정됩니다. | |
| rotateTimes | Number | 일반적인 회전 외에 트위닝된 요소가 시작 키프레임과 다음 키프레임 사이에서 회전하는 횟수를 지정합니다. Adobe Flash Professional에서는 이 값이 0보다 크거나 같은 정수여야 하지만, motion 클래스에서는 소수 값도 사용할 수 있습니다. | |
| tweenScale | Boolean | false인 경우 트위닝 중에 크기를 변경할 수 없습니다. XML에서 이 특성을 생략하면 기본적으로 true로 설정됩니다. | |
| cacheAsBitmap | Boolean | XML에서 이 특성을 생략하면 기본적으로 false로 설정됩니다. | |
| blendMode | String | "normal", "layer", "multiply", "screen", "overlay", "hardlight", "lighten", "darken", "difference", "add", "subtract", "invert", "alpha" 및 "erase" 값을 사용할 수 있습니다. XML에서 이 특성을 생략하면 기본적으로 "normal"로 지정됩니다. | |
| orientToPath | Boolean | XML에서 이 특성을 생략하면 기본적으로 false로 설정됩니다. | |
| Color | 색상 변화에 대한 설정이 포함됩니다. Flash 기호 인스턴스에는 없음, 알파, 색조, 밝기, 고급 등 다섯 가지 색상 모드가 있습니다. 변형을 적용하지 않으려면 즉, 없음 모드를 지정하려면 Color 태그를 비워 두어 일반적인 모양으로 나타나도록 합니다. 알파 변형을 적용하려면 alphaMultiplier 및 alphaOffset 특성을 설정합니다. 색조 변형을 적용하려면 tintColor 및 tintMultiplier 특성을 설정합니다.밝기 변형을 적용하려면 brightness 특성을 사용합니다.고급 변형을 적용하려면redMultiplier, greenMultiplier, blueMultiplier, alphaMultiplier, redOffset, greenOffset, blueOffset 및 alphaOffset 특성을 사용합니다. | ||
| brightness | Number | -1에서 1 사이의 값으로 지정하는 밝기 채널 적용률입니다. 여기서 -1은 완전한 검은색을, 1은 완전한 흰색을 나타냅니다. | |
| tintColor | Hexidecimal | 적용할 색상을 나타내는 16진수 색상 값입니다. | |
| alphaMultiplier | Number | 0에서 1 사이의 소수 값으로 나타내는 알파 채널 적용률입니다. | |
| redMultiplier | Number | 0에서 1 사이의 10진수 값으로 나타내는 색상 적용률입니다. | |
| greenMultiplier | Number | 0에서 1 사이의 10진수 값으로 나타내는 색상 적용률입니다. | |
| blueMultiplier | Number | 0에서 1 사이의 10진수 값으로 나타내는 색상 적용률입니다. | |
| alphaMultiplier | Number | 알파 투명도 채널 적용률을 나타내는 0에서 1 사이의 소수 값입니다. | |
| tintMultiplier | Number | tintColor 값 적용률을 나타내는 0에서 1 사이의 소수 값입니다. | |
| redOffset | Number | redMultiplier 값에 곱한 후 빨강 채널 값에 더해지는 -255에서 255 사이의 숫자입니다. | |
| greenOffset | Number | greenMultiplier 값에 곱한 후 녹색 채널 값에 더해지는 -255에서 255 사이의 숫자입니다. | |
| blueOffset | Number | blueMultiplier 값에 곱한 후 파랑 채널 값에 더해지는 -255에서 255 사이의 숫자입니다. | |
| alphaOffset | Number | alphaMultiplier 값을 곱한 알파 채널 값에 더해지는 -255에서 255 사이의 숫자입니다. | |
| tweens | 여유 변화에 대한 설정이 포함됩니다. | ||
| SimpleEase | 모든 여유 속성에 대해 모션 트위닝 동안 단일 값이 유지되도록 여유 설정을 정의합니다. | ||
| ease | Number | 모션 트윈의 모든 속성에 적용할 여유 값입니다. ease 특성은 -1(100% 가속)에서 1(100% 감속) 사이의 비율입니다. 기본값은 0입니다. 즉, 트윈이 가속이나 감속 없이 일정한 속도로 애니메이트됩니다. | |
| target | Number | Flash Professional에서는 모든 여유 속성에 동일한 값이 적용되므로 Adobe Flash Professional의 [모션 복사] 및 [모션 붙여넣기] 명령을 사용하는 경우 제작 도구에서는 SimpleEase 요소의 target 특성이 포함되지 않은 XML을 생성합니다. 그러나 ActionScript 3.0에서는 개별적인 속성에 서로 다른 SimpleEase 값을 동시에 적용할 수 있습니다. target에 적용할 수 있는 값은 "position", "scale", "rotation", "color", "filters", "x", "y", "scaleX", "scaleY", "skewX" 및 "skewY"로 CustomEase에 적용할 수 있는 값과 동일합니다. | |
| CustomEase | 3차 베지어 곡선으로 구성된 사용자 정의 여유 곡선을 정의합니다. 동시에 모든 속성에 적용하거나 개별적인 속성에 대해 서로 다른 곡선을 정의할 수 있습니다. 사용자 정의 여유 속성을 나타내는 곡선에 대한 자세한 정보는 CustomEase 클래스를 참조하십시오. | ||
| target | Number | 사용자 정의 값이 지정되는 속성입니다. Adobe Flash Professional의 [모션 복사] 및 [모션 붙여넣기] 명령을 사용하는 경우 제작 도구에서는 target에 대해 "position", "scale", "rotation", "color" 또는 "filters"라는 값을 생성합니다. ActionScript 3.0의 motion 클래스를 사용하면 훨씬 더 융통성 있게 "x", "y", "scaleX", "scaleY", "skewX" 및 "skewY"에 대해 개별적인 곡선을 정의할 수 있습니다. XML에서 "target" 특성을 생략하면 모든 여유 속성이 대상이 됩니다. 중요:XML에서는 사용자 정의 여유 곡선의 첫 번째 점과 마지막 점이 생략됩니다. 첫 번째 점은 항상 (0, 0)(트위닝되는 속성의 시작 값)이어야 하고 마지막 점은 (1, 1)(트위닝되는 속성의 끝 값)이어야 합니다. 코드의 효율성을 유지하고 오류를 막기 위해 XML에서 이러한 값을 생략하고 무조건 적용되도록 합니다. | |
| BezierControl | 곡선을 기준으로 지정되는 점으로서 곡선을 정의하는 데 사용됩니다. | ||
| x | Number | 곡선을 정의하기 위한 점의 x 좌표입니다. | |
| y | Number | 곡선을 정의하기 위한 점의 y 좌표입니다. | |
| BezierNode | 곡선 위의 점으로서 곡선을 정의하는 데 사용됩니다. | ||
| x | Number | 곡선 위의 점의 x 좌표입니다. | |
| y | Number | 곡선 위의 점의 y 좌표입니다. | |
| filters | flash.filters 패키지의 객체에서 요소를 사용하도록 정의합니다(예: filters:GlowFilter). 지정된 flash.filters 객체의 속성에 대응하는 특성을 추가할 수 있습니다. 예를 들면 다음과 같습니다. <filters:DropShadowFilter quality="1" inner="false" knockout="false" hideObject="false" distance="0" angle="45" color="0x000000" alpha="1" blurX="0" blurY="0" strength="0" />. flash.filters 패키지를 참조하십시오. |
다음 예제에서는 ActionScript를 인라인 XML과 함께 사용하여 moveShape 동영상 클립 인스턴스의 모션 트윈을 작성하는 방법을 보여 줍니다. 이 모션 트윈에서 myShape 심볼은 10 프레임 동안 회전하고 이동하며 사용자 정의 여유 설정을 사용하고 알파 값을 변경합니다.
import fl.motion.Animator;
var moveShape_xml:XML = <Motion duration="10" xmlns="fl.motion.*" xmlns:geom="flash.geom.*" xmlns:filters="flash.filters.*">
<source>
<Source frameRate="12" x="41.35" y="91.35" scaleX="1" scaleY="1" rotation="0" elementType="movie clip" instanceName="moveShape" symbolName="myShape">
<dimensions>
<geom:Rectangle left="-46.65" top="-61.95" width="133.05" height="133.95"/>
</dimensions>
<transformationPoint>
<geom:Point x="0.49981210071401727" y="0.4998133631952222"/>
</transformationPoint>
</Source>
</source>
<Keyframe index="0" rotateTimes="2">
<tweens>
<CustomEase>
<BezierControl x="0.08650266979261687" y="0.14705453864744866"/>
<BezierControl x="0.23675978562091857" y="0.28829454738109694"/>
<BezierNode x="0.2689728109485753" y="0.49688733564952436"/>
<BezierControl x="0.32093023255813957" y="0.8333333333333333"/>
<BezierControl x="0.5988021982960045" y="1.034249160488573"/>
<BezierNode x="0.7309082984924317" y="0.8685852488735627"/>
<BezierControl x="0.8116279069767443" y="0.767361111111111"/>
<BezierControl x="0.910302766164144" y="0.9730908298492431"/>
</CustomEase>
</tweens>
</Keyframe>
<Keyframe index="9" x="371.95" y="188">
<color>
<Color alphaMultiplier="0.4" alphaOffset="0"/>
</color>
</Keyframe>
</Motion>;
var moveShape_animator:Animator = new Animator(moveShape_xml, moveShape);
moveShape_animator.play();Tue Jun 12 2018, 03:34 PM Z