套件 | fl.transitions |
類別 | public class Tween |
繼承 | Tween EventDispatcher Object |
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
Tween 類別也能讓您指定多種加/減速方法。 「加/減速」是指在動畫進行時的逐漸加速或減速,可以讓動畫更具真實感。 fl.transitions.easing 套件會提供許多加/減速方法都有這種加速和減速的方程式,加/減速動畫將根據這些方程式而變更。
若要使用 Tween 類別的方法和屬性,請搭配建構函數使用 new
運算子以建立類別的實體,然後指定加/減速方法做為參數。 例如:
import fl.transitions.Tween; import fl.transitions.easing.*; var myTween:Tween = new Tween(myObject, "x", Elastic.easeOut, 0, 300, 3, true);
相關 API 元素
屬性 | 定義自 | ||
---|---|---|---|
begin : Number = NaN
補間動畫開始播放前目標物件之指定屬性的初始值。 | Tween | ||
constructor : Object
類別物件的參照或是特定物件實體的建構函數。 | Object | ||
duration : Number
以影格或秒數計算的補間動畫持續時間。 | Tween | ||
finish : Number
數字,指出要接受補間動畫處理之目標物件屬性的結束值。 | Tween | ||
FPS : Number
補間動畫每秒計算的影格數。 | Tween | ||
func : Function
與補間動畫搭配使用的加/減速函數。 | Tween | ||
isPlaying : Boolean = false
指出目前是否正在播放補間動畫。 | Tween | ||
looping : Boolean = false
指出補間動畫是否會重複播放。 | Tween | ||
obj : Object = null
正在進行補間動畫處理的目標物件。 | Tween | ||
position : Number
接受補間動畫處理之目標物件屬性的目前值。 | Tween | ||
prop : String
受到目標物件補間動畫影響的屬性名稱。 | Tween | ||
time : Number
在動畫持續時間以內的目前時間。 | Tween | ||
useSeconds : Boolean = false
指出補間動畫是依影格數或秒數播放。 | Tween |
方法 | 定義自 | ||
---|---|---|---|
Tween(obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean = false)
會建立 Tween 類別的實體。 | Tween | ||
addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void
會在 EventDispatcher 物件註冊事件偵聽程式,以便讓偵聽程式收到事件的通知。 | EventDispatcher | ||
會指示補間動畫從其目前的動畫點持續補間動畫到新的完成和持續時間點。 | Tween | ||
會將事件傳送到事件流程。 | EventDispatcher | ||
會直接將補間動畫快轉到補間動畫的最終值。 | Tween | ||
會檢查 EventDispatcher 物件是否有對特定的事件類型註冊偵聽程式。 | EventDispatcher | ||
指出物件是否有已定義的指定屬性。 | Object | ||
指出 Object 類別的實體是否位於指定為參數的物件原型鏈中。 | Object | ||
會快轉補間動畫到已經停止的動畫的下一個影格。 | Tween | ||
會播放補間動畫被停止的目前停止點的前一個影格。 | Tween | ||
指出指定的屬性是否存在,以及是否可列舉。 | Object | ||
會從 EventDispatcher 物件移除偵聽程式。 | EventDispatcher | ||
會繼續播放已經停止的補間動畫。 | Tween | ||
會移動補間動畫的播放點回到它的起始值。 | Tween | ||
為迴圈作業設定動態屬性的可用性。 | Object | ||
會從補間動畫起始點開始播放。 | Tween | ||
會在補間動畫目前的值停止播放。 | Tween | ||
傳回代表此物件的字串,根據地區特定慣例進行格式化。 | Object | ||
會傳回指定之物件的字串形式。 | Object | ||
會傳回指定之物件的基本值。 | Object | ||
檢查此 EventDispatcher 物件是否已註冊事件偵聽程式,或者此物件的任何祖系已為特定事件類型註冊事件偵聽程式。 | EventDispatcher | ||
會指示補間動畫以補間動畫屬性遞增前一個方向的相反方向播放。 | Tween |
事件 | 摘要 | 定義自 | ||
---|---|---|---|---|
[廣播事件] 當 Flash Player 或 AIR 應用程式取得作業系統焦點並成為作用中時傳送。 | EventDispatcher | |||
[廣播事件] 當 Flash Player 或 AIR 應用程式失去作業系統焦點並成為非作用中時傳送。 | EventDispatcher | |||
會指出 Tween 已變更而且螢幕已更新。 | Tween | |||
會指出 Tween 已經到達結尾並完成。 | Tween | |||
會指出 Tween 已經在重複模式下從頭開始播放。 | Tween | |||
會指出 Tween 已經在暫停之後繼續播放。 | Tween | |||
會指出移動已開始播放。 | Tween | |||
會指出已經明確呼叫 Tween.stop() 而使 Tween 停止。 | Tween |
begin | 屬性 |
public var begin:Number = NaN
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
補間動畫開始播放前目標物件之指定屬性的初始值。
duration | 屬性 |
finish | 屬性 |
FPS | 屬性 |
FPS:Number
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
補間動畫每秒計算的影格數。 依據預設,會使用目前「舞台」影格速率來計算補間動畫。 設定此屬性會重新計算動畫屬性中的遞增數,顯示每秒的 Tween.FPS
屬性,而不是目前「舞台」的影格速率。 設定 Tween.FPS 屬性不會改變「舞台」的實際影格速率。
注意:除非一開始就明確地設定,否則 Tween.FPS
屬性會傳回 undefined。
實作
public function get FPS():Number
public function set FPS(value:Number):void
範例 ( 如何使用本範例 )
import fl.transitions.Tween; import fl.transitions.easing.*; var tween:Tween = new Tween(mc, "x", Elastic.easeOut, 0, 300, 3, true); tween.FPS = 60; mc.addEventListener(MouseEvent.CLICK, onClick); function onClick(evt:MouseEvent):void { tween.start(); }
func | 屬性 |
public var func:Function
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
與補間動畫搭配使用的加/減速函數。
isPlaying | 屬性 |
public var isPlaying:Boolean = false
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
指出目前是否正在播放補間動畫。
looping | 屬性 |
public var looping:Boolean = false
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
指出補間動畫是否會重複播放。 如果值為 true
,補間動畫會在每次播完之後,不斷地重複播放。 如果值為 false
,則補間動畫只會播放一次。
obj | 屬性 |
public var obj:Object = null
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
正在進行補間動畫處理的目標物件。
position | 屬性 |
prop | 屬性 |
public var prop:String
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
受到目標物件補間動畫影響的屬性名稱。
time | 屬性 |
useSeconds | 屬性 |
public var useSeconds:Boolean = false
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
指出補間動畫是依影格數或秒數播放。 值為 true
會讓補間動畫依 duration
屬性指定的秒數播放。 值為 false
則會讓補間動畫依影格數播放。
Tween | () | 建構函式 |
public function Tween(obj:Object, prop:String, func:Function, begin:Number, finish:Number, duration:Number, useSeconds:Boolean = false)
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會建立 Tween 類別的實體。 您可以使用建構函數並搭配 new
運算子:var myTween:Tween = new Tween()
。
obj:Object — 「補間動畫」的目標物件。
| |
prop:String — 將會受影響的屬性名稱 (obj 參數值)。
| |
func:Function — 要使用的加/減速函數名稱。
| |
begin:Number — prop 參數的起始值。
| |
finish:Number — 指出 prop 結束值的數字 (要使用補間動畫的目標物件屬性)。
| |
duration:Number — 移動的時間長度。如果為負值或省略,則請設定為 infinity 。
| |
useSeconds:Boolean (default = false ) — 旗標,指定是否使用秒數,而不使用影格數。 如果為 true ,函數會使用秒數;如果為 false ,則會使用相對於 duration 參數中指定值的影格數。
|
相關 API 元素
continueTo | () | 方法 |
public function continueTo(finish:Number, duration:Number):void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指示補間動畫從其目前的動畫點持續補間動畫到新的完成和持續時間點。
參數
finish:Number — 數字,指出要接受補間動畫處理之目標物件屬性的結束值。
| |
duration:Number — 數字,指示補間動畫移動的時間長度或影格數量。如果 Tween.start() useSeconds 參數設定為 true ,便會以時間長度測量持續時間;如果設定為 false ,則以影格進行測量。
|
相關 API 元素
fforward | () | 方法 |
public function fforward():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會直接將補間動畫快轉到補間動畫的最終值。
nextFrame | () | 方法 |
public function nextFrame():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會快轉補間動畫到已經停止的動畫的下一個影格。 您可以在使用 Tween.stop()
方法停止補間動畫之後,使用此方法一次快轉補間動畫的一個影格。
注意:請只針對影格架構的補間動畫使用此方法。 將 useSeconds
參數設定為 false
,即可在建立時將補間動畫設定成影格架構。
prevFrame | () | 方法 |
resume | () | 方法 |
public function resume():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會繼續播放已經停止的補間動畫。 您可以在使用 Tween.stop()
方法停止補間動畫之後,使用這個方法繼續補間動畫。
注意:請只針對影格架構的補間動畫使用此方法。 將 useSeconds
參數設定為 false,即可在建立時將補間動畫設定成影格架構。
rewind | () | 方法 |
public function rewind(t:Number = 0):void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會移動補間動畫的播放點回到它的起始值。 如果在補間動畫仍在播放時呼叫 Tween.rewind()
,動畫便會倒帶回到起始值並繼續播放。 如果在補間動畫已經停止或完成動畫時呼叫 Tween.rewind()
,補間動畫便會倒帶回到起始值並維持停止。 在您使用 Tween.stop()
方法停止補間動畫或要在補間動畫播放時倒帶後,請使用這個方法將補間動畫倒帶到起始點。
參數
t:Number (default = 0 ) — 起始值。
|
start | () | 方法 |
public function start():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會從補間動畫起始點開始播放。 此方法可用來在「補間動畫」停止或完成其動畫時,從補間動畫的開頭重新啟動。
stop | () | 方法 |
public function stop():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會在補間動畫目前的值停止播放。
yoyo | () | 方法 |
public function yoyo():void
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指示補間動畫以補間動畫屬性遞增前一個方向的相反方向播放。 如果在 Tween 物件動畫完成之前呼叫此方法,動畫便會突然地跳到播放的尾端,然後從端點反方向播放。 您可以達到動畫完成整個播放的特效,然後在 TweenEvent.MOTION_FINISH
事件處理常式中呼叫 Tween.yoyo()
方法來反向播放整個動畫。 此程序可以確保除非完成目前的補間動畫,否則不會開始 Tween.yoyo()
方法的反轉特效。
motionChange | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_CHANGE
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出 Tween 已變更而且螢幕已更新。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
motionFinish | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_FINISH
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出 Tween 已經到達結尾並完成。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
motionLoop | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_LOOP
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出 Tween 已經在重複模式下從頭開始播放。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
motionResume | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_RESUME
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出 Tween 已經在暫停之後繼續播放。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
motionStart | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_START
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出移動已開始播放。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
motionStop | 事件 |
fl.transitions.TweenEvent
屬性 TweenEvent.type =
fl.transitions.TweenEvent.MOTION_STOP
語言版本: | ActionScript 3.0 |
產品版本: | Flash CS3 |
執行階段版本: | Flash Player 9, AIR 1.0 |
會指出已經明確呼叫
Tween.stop()
而使 Tween 停止。
事件物件的屬性值如下:
屬性 | 值 |
---|---|
bubbles | false |
cancelable | false |
currentTarget | 定義處理此事件之事件偵聽程式的物件。 例如,如果您使用 myButton.addEventListener() 來註冊事件偵聽程式,myButton 即是 currentTarget 屬性的值。 |
target | 已傳送事件的物件。此物件不一定是偵聽事件的物件。 您可以使用 currentTarget 屬性,隨時存取偵聽事件的物件。 |
time | Tween 在事件發生時的時間。 |
position | 在事件發生時,由 Tween 控制的屬性值。 |
userNumber
中,然後傳送至 Tween 建構函式,變成圖形寬度的參數。
注意:至於 fl.transitions 套件中的類別,您必須使用 import
陳述式,即使用在 Flash Professional 的「動作」窗格中 (對於大部分類別,在「動作」窗格中您不需要 import 陳述式)。在套件層級使用 *,指出將所有類別包含在套件中,或者個別匯入。
import fl.transitions.Tween; import fl.transitions.easing.*; //create a Sprite instance var mySprite:Sprite = new Sprite() // create an input text field var myTextField:TextField = new TextField(); myTextField.type = TextFieldType.INPUT; myTextField.width = 180; myTextField.height = 20; myTextField.x = 20; myTextField.y = 140; myTextField.border = true; myTextField.text = "Type a number here and press Enter"; myTextField.restrict = "0-9"; addChild(myTextField); // add a listener when the user clicks in the text field myTextField.addEventListener(MouseEvent.CLICK, fieldClickHandler); // add a listener for a key press myTextField.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler); // clear the text field when the user clicks in it to enter a value function fieldClickHandler(event:MouseEvent):void { myTextField.text = ""; } // if the key pressed is the Enter key // change the values of the box's width based on the value provided function keyDownHandler(event:KeyboardEvent):void { if (event.keyCode == Keyboard.ENTER) { mySprite.graphics.clear(); var userNumber:Number = new Number(myTextField.text); mySprite.graphics.beginFill(0x666999); mySprite.graphics.drawRect(0, 0, 40, 120); addChild(mySprite); //provide tween values, including passing the variable userNumber for the width at //the end of the tween var myTween:Tween = new Tween(mySprite, "width", Elastic.easeOut, 0, userNumber, 4, true); } }
import fl.transitions.Tween; import fl.transitions.easing.*; //create a Sprite instance var mySprite:Sprite = new Sprite() // create an input text field var myTextField:TextField = new TextField(); myTextField.type = TextFieldType.INPUT; myTextField.width = 180; myTextField.height = 20; myTextField.x = 20; myTextField.y = 140; myTextField.border = true; myTextField.text = "Type a number here and press Enter"; myTextField.restrict = "0-9"; addChild(myTextField); // add a listener when the user clicks in the text field myTextField.addEventListener(MouseEvent.CLICK, fieldClickHandler); // add a listener for a key press myTextField.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler); // clear the text field when the user clicks in it to enter a value function fieldClickHandler(event:MouseEvent):void { myTextField.text = ""; } // if the key pressed is the Enter key // change the values of the box's width based on the value provided function keyDownHandler(event:KeyboardEvent):void { if (event.keyCode == Keyboard.ENTER) { mySprite.graphics.clear(); var userNumber:Number = new Number(myTextField.text); // Set up drawing data // stroke object var myStroke:GraphicsStroke = new GraphicsStroke(2); myStroke.joints = JointStyle.MITER; myStroke.fill = new GraphicsSolidFill(0x102020); // solid stroke // fill object var myFill:GraphicsGradientFill = new GraphicsGradientFill(); myFill.colors = [0xEEFFEE, 0x0000FF]; myFill.matrix = new Matrix(); myFill.matrix.createGradientBox(300, 300, 0); // path object var myPath:GraphicsPath = new GraphicsPath(new Vector.<int>(), new Vector.<Number>()); myPath.commands.push(1,2,2,2,2); myPath.data.push(0,0, 240,0, 240,60, 0,60, 0,0); // combine the objects for a complete drawing var myDrawing:Vector.<IGraphicsData> = new Vector.<IGraphicsData>(); myDrawing.push(myStroke, myFill, myPath); // render the drawing mySprite.graphics.drawGraphicsData(myDrawing); addChild(mySprite); //provide tween values, including passing the variable userNumber for the width at //the end of the tween var myTween:Tween = new Tween(mySprite, "width", Elastic.easeOut, 0, userNumber, 4, true); } }
Tue Jun 12 2018, 03:47 PM Z