您可以使用 fl.motion 套件中的 XML 和 ActionScript 類別來描述移動補間動畫。Adobe Flash Professional 的「將移動複製為 ActionScript」命令可以根據「時間軸」上的移動補間動畫,將產生的 XML 和 ActionScript 用於其它元件或其它專案。您也可以編寫自己的移動補間動畫 Script。只要在編譯階段於類別路徑中加入 fl.motion 類別,就可以將移動補間動畫套用到您指定的顯示物件。如需有關 motion 類別的詳細資訊,請參閱 fl.motion 套件。支援的 XML 元素會對應至「適用於 Adobe Flash Platform 的 ActionScript 3.0 參考」中的類別和屬性。
© 2015 Adobe Systems Incorporated. All rights reserved.
Tue Jun 12 2018, 04:04 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 | 定義 Motion 實體使 Flash 可以指定用來區分移動補間動畫特徵的屬性。請參閱 fl.motion.Motion 類別。 | ||
duration | Number | 已選取之移動補間動畫的影格數目。請參閱 fl.motion.MotionBase.duration 屬性。 | |
source | 包含和移動相關之原始視覺物件的屬性。請參閱 fl.motion.Source 類別。 | ||
Source | frameRate | Number | SWF 檔案的每秒影格數 (fps) 設定,其中包含從 Flash Professional 複製而來的原始動畫。這個值對在不同 SWF 檔中的 ActionScript 實作沒有任何作用。請參閱 fl.motion.Source.frameRate 屬性。 |
x | Number | 元件實體之變形點的 x 座標 (位於從 Flash Professional 複製而來的原始移動補間動畫開頭)。 | |
y | Number | 元件實體之變形點的 y 座標 (位於從 Flash Professional 複製而來的原始移動補間動畫開頭)。 | |
scaleX | Number | 水平縮放的百分比,以十進位值表示。這個值通常介於 0 和 1 之間,但也可以大於 1 或小於 0。例如,您可以將 scaleX 設為 -1 以翻轉物件,或是設為 3 使其成為原始大小的三倍。 | |
skewX | Number | 沿著水平軸傾斜的角度 (以度為單位)。如果 skewX 和 skewY 兩者的值相等,則由 rotation 特質取代。 | |
skewY | Number | 沿著垂直軸傾斜的角度 (以度為單位)。如果 skewX 和 skewY 兩者的值相等,則由 rotation 特質取代。 | |
rotation | Number | 起始影格的旋轉角度。 | |
elementType | 字串 | 移動補間動畫中使用的視覺物件類型。可能的值為:"movie clip"、"button"、"graphic"、"rectangle object"、"oval object"、"drawing object"、"group"、"bitmap"、"compiled clip"、"video" 或 "text"。 | |
symbolName | 字串 | 如果有元件實體的話,則為 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 | 字串 | 選擇性字串,用來描述關鍵影格和對應至「時間軸」的影格標籤。 | |
tweenSync | Boolean | 將同步設定切換為開啟 ("true") 和關閉 ("false")。同步會重新計算補間動畫中的影格數目,以符合它們在「時間軸」上配置的影格數目。這個特質對 ActionScript 動畫沒有作用,因為 ActionScript 不可以控制圖像元件。只有 Adobe Flash Professional 的「複製移動」和「貼上移動」命令可以使用 XML 特質。如果在 XML 中省略,預設為 true。 | |
tweenSnap | Boolean | 將「貼齊」設定切換為開啟 ("true") 和關閉 ("false")。貼齊可以將元件的註冊點附加到移動路徑上。這個特質對 ActionScript 動畫沒有作用,因為 ActionScript 不可以控制圖像元件。只有 Adobe Flash Professional 的「複製移動」和「貼上移動」命令可以使用 XML 特質。如果在 XML 中省略,預設為 true。 | |
x | Number | 目前關鍵影格上,元件實體中心點的 x 座標。 | |
y | Number | 目前關鍵影格上,元件實體中心點的 y 座標。 | |
scaleX | Number | 水平縮放的百分比,以 0 和 1 之間的十進位值表示。這個值通常介於 0 和 1 之間,但也可以大於 1 或小於 0。例如,您可以將 scaleX 設定為 -1 以翻轉物件,或是設定為 3 將它放大為三倍。 | |
scaleY | Number | 垂直縮放的百分比,以 0 和 1 之間的十進位值表示。這個值通常介於 0 和 1 之間,但也可以大於 1 或小於 0。例如,您可以將 scaleY 設定為 -1 以翻轉物件,或是設定為 3 將它放大為三倍。 | |
skewX | Number | 沿著水平軸傾斜的角度 (以度為單位)。如果 skewX 和 skewY 兩者的值相等,則由 rotation 特質取代。 | |
skewY | Number | 沿著垂直軸傾斜的角度 (以度為單位)。如果 skewX 和 skewY 兩者的值相等,則由 rotation 特質取代。 | |
rotation | Number | 目前影格的旋轉角度。 | |
rotateDirection | 字串 | 指定補間動畫元素的旋轉方式。可能的值包括 "auto"、"none"、"cw"、"ccw"。如果在 XML 中省略,預設為 "auto"。 | |
rotateTimes | Number | 指定起始關鍵影格和下一個關鍵影格之間,補間動畫元素的旋轉次數 (除一般旋轉以外)。Adobe Flash Professional 需要 0 或更大的整數值,但是 motion 類別允許十進位值。 | |
tweenScale | Boolean | 如果為 false,則在補間動畫期間禁止變更縮放比例。如果在 XML 中省略,預設為 true。 | |
cacheAsBitmap | Boolean | 如果在 XML 中省略,預設為 false。 | |
blendMode | 字串 | 可能的值包括 "normal"、"layer"、"multiply", "screen"、"overlay"、"hardlight"、"lighten"、"darken"、"difference"、"add"、"subtract"、"invert"、"alpha" 和 "erase"。如果在 XML 中省略,預設為 "normal"。 | |
orientToPath | Boolean | 如果在 XML 中省略,預設為 false。 | |
Color | 包含色彩變化的設定。Flash 元件實體有五種色彩模式:none、 alpha、 tint、 brightness 和 advanced。 如果不使用色彩變化 (none),Color 標籤為空白,表示將顯示一般外觀。如果選取 Alpha 色彩變化,請設定 alphaMultiplier 和 alphaOffset 特質。如果選取 Tint 色彩變化,請設定 tintColor 和 tintMultiplier 特質。如果選取 brightness 色彩變化,請使用 brightness 特質。如果選取 advanced 色彩變化,請使用 redMultiplier、greenMultiplier、blueMultiplier、alphaMultiplier、redOffset、greenOffset、blueOffset 和 alphaOffset 特質。 | ||
brightness | Number | 套用亮度色版 -1 和 1 之間的百分比,其中 -1 代表全黑,1 代表全白. | |
tintColor | 十六進位值 | 代表要套用之顏色的十六進位顏色值。 | |
alphaMultiplier | Number | 套用 Alpha 色版的百分比,也就是介於 0 和 1 之間的十進位值。 | |
redMultiplier | Number | 要套用顏色的百分比,也就是介於 0 和 1 之間的十進位值。 | |
greenMultiplier | Number | 要套用顏色的百分比,也就是介於 0 和 1 之間的十進位值。 | |
blueMultiplier | Number | 要套用顏色的百分比,也就是介於 0 和 1 之間的十進位值。 | |
alphaMultiplier | Number | 介於 0 和 1 之間的十進位值,代表套用 Alpha 透明度色版的百分比。 | |
tintMultiplier | Number | 介於 0 和 1 之間的十進位值,代表套用 tintColor 值的百分比。 | |
redOffset | Number | 從 -255 到 255 的數字。將會在乘以 redMultiplier 值之後,加上紅色色版值。 | |
greenOffset | Number | 從 -255 到 255 的數字。將會在乘以 greenMultiplier 值之後,加上綠色色版值。 | |
blueOffset | Number | 從 -255 到 255 的數字。將會在乘以 blueMultiplier 值之後,加上藍色色版值。 | |
alphaOffset | Number | 從 -255 到 255 的數字。將會在乘以 alphaMultiplier 值之後,加上 Alpha 色版值。 | |
tweens | 包含加/減速變化的設定。 | ||
SimpleEase | 使用單一值為每個移動補間動畫的加/減速屬性定義加/減速變化設定。 | ||
ease | Number | 套用到移動補間動畫之所有屬性的加/減速值。加/減速特質是介於 -1 (100% 加速) 和 1 (100% 減速) 之間的百分比值。預設值為 0,表示補間動畫以固定速度移動,不加速或減速。 | |
target | Number | 當使用 Adobe Flash Professional 的「複製移動」和「貼上移動」命令時,由於 Flash Professional 會將同一個值套用到所有的加/減速屬性,因此編寫工具產生的 XML 中不會包含 SimpleEase 元素的 target 特質。不過,ActionScript 3.0 類別可以讓您同時將不同的 SimpleEase 值套用至各個屬性。 target 的可能值與 CustomEase 相同:"position"、"scale"、"rotation"、"color"、"filters"、"x"、"y"、"scaleX"、"scaleY"、"skewX" 和 "skewY"。 | |
CustomEase | 定義由三次方貝茲曲線構成的自訂加/減速曲線。您可以一次將它套用至所有的屬性,或是為不同的屬性定義不同的曲線。 如需有關代表自訂加/減速屬性之曲線的詳細資訊,請參閱 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 套件。 |
下列範例顯示包含內嵌 XML 的 ActionScript,描述 myShape 元件的 moveShape 影片片段實體在旋轉、移動、使用自訂加/減速設定,及變更 10 個影格的 Alpha 值時的移動補間動畫:
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, 04:04 PM Z