Package | com.greensock.data |
Class | public class TweenLiteVars |
Inheritance | TweenLiteVars ![]() |
The down side, of course, is that the code is more verbose and TweenLiteVars adds about 5kb to your published swf.
USAGE:
Note that each method returns the TweenLiteVars object, so you can reduce the lines of code by method chaining (see example below).
Without TweenLiteVars:
TweenLite.to(mc, 1, {x:300, y:100, tint:0xFF0000, onComplete:myFunction, onCompleteParams:[mc]})
With TweenLiteVars
TweenLite.to(mc, 1, new TweenLiteVars().move(300, 100).tint(0xFF0000).onComplete(myFunction, [mc]));
You can use the prop() method to set individual generic properties (like "myCustomProperty" or "rotationY") or you can pass a generic Object into the constructor to make it a bit more concise, like this:
TweenLite.to(mc, 1, new TweenLiteVars({myCustomProperty:300, rotationY:100}).tint(0xFF0000).onComplete(myFunction, [mc]));
NOTES:
TweenLite.to(mc, 1, new TweenLiteVars({x:300, y:100}).tint(0xFF0000).onComplete(myFunction, [mc]).vars);
Copyright 2008-2013, GreenSock. All rights reserved. This work is subject to the terms in http://www.greensock.com/terms_of_use.html or for Club GreenSock members, the software agreement that was issued with the membership.
Property | Defined By | ||
---|---|---|---|
vars : Object [read-only] The generic object populated by all of the method calls in the TweenLiteVars instance. | TweenLiteVars |
Method | Defined By | ||
---|---|---|---|
TweenLiteVars(vars:Object = null)
Constructor
| TweenLiteVars | ||
autoAlpha(alpha:Number):TweenLiteVars Same as changing the "alpha" property but with the additional feature of toggling the "visible" property to false whenever alpha is 0, thus improving rendering performance in the Flash Player. | TweenLiteVars | ||
bevelFilter(distance:Number = 4, angle:Number = 45, highlightColor:uint = 0xFFFFFF, highlightAlpha:Number = 0.5, shadowColor:uint = 0x000000, shadowAlpha:Number = 0.5, blurX:Number = 4, blurY:Number = 4, strength:Number = 1, quality:int = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a BevelFilter
| TweenLiteVars | ||
bezier(values:Array):TweenLiteVars
Bezier tweening allows you to tween in a non-linear way. | TweenLiteVars | ||
bezierThrough(values:Array):TweenLiteVars
Identical to bezier except that instead of passing Bezier control point values, you pass values through
which the Bezier values should move. | TweenLiteVars | ||
blurFilter(blurX:Number, blurY:Number, quality:int = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a BlurFilter
| TweenLiteVars | ||
circlePath2D(path:MotionPath, startAngle:Number, endAngle:Number, autoRotate:Boolean = false, direction:String = clockwise, extraRevolutions:uint = 0, rotationOffset:Number = 0, useRadians:Boolean = false):TweenLiteVars
Tweens an object along a CirclePath2D motion path in any direction (clockwise, counter-clockwise, or shortest). | TweenLiteVars | ||
colorMatrixFilter(colorize:uint = 0xFFFFFF, amount:Number = 1, saturation:Number = 1, contrast:Number = 1, brightness:Number = 1, hue:Number = 0, threshold:Number = -1, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
ColorMatrixFilter tweening offers an easy way to tween a DisplayObject's saturation, hue, contrast,
brightness, and colorization. | TweenLiteVars | ||
colorTransform(tint:Number, tintAmount:Number, exposure:Number, brightness:Number, redMultiplier:Number, greenMultiplier:Number, blueMultiplier:Number, alphaMultiplier:Number, redOffset:Number, greenOffset:Number, blueOffset:Number, alphaOffset:Number):TweenLiteVars
Tweens ColorTransform properties of a DisplayObject to do advanced effects like overexposing, altering
the brightness or setting the percent/amount of tint. | TweenLiteVars | ||
data(data:*):TweenLiteVars Any generic data that you'd like associated with your tween. | TweenLiteVars | ||
delay(delay:Number):TweenLiteVars The number of seconds (or frames for frames-based tweens) to delay before the tween begins. | TweenLiteVars | ||
dropShadowFilter(distance:Number = 4, blurX:Number = 4, blurY:Number = 4, alpha:Number = 1, angle:Number = 45, color:uint = 0x000000, strength:Number = 2, inner:Boolean = false, knockout:Boolean = false, hideObject:Boolean = false, quality:uint = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a DropShadowFilter. | TweenLiteVars | ||
dynamicProps(props:Object, params:Object = null):TweenLiteVars
If you'd like to tween something to a destination value that may change at any time,
dynamicProps allows you to simply associate a function with a property so that
every time the tween is rendered, it calls that function to get the new destination value
for the associated property. | TweenLiteVars | ||
ease(ease:*, easeParams:Array = null):TweenLiteVars
Controls the rate of change. | TweenLiteVars | ||
endArray(values:Array):TweenLiteVars An Array containing numeric end values of the target Array. | TweenLiteVars | ||
frame(value:int, relative:Boolean = false):TweenLiteVars
Tweens a MovieClip to a particular frame. | TweenLiteVars | ||
frameBackward(frame:int):TweenLiteVars
Tweens a MovieClip backward to a particular frame number, wrapping it if/when it reaches the beginning
of the timeline. | TweenLiteVars | ||
frameForward(frame:int):TweenLiteVars
Tweens a MovieClip forward to a particular frame number, wrapping it if/when it reaches the end
of the timeline. | TweenLiteVars | ||
frameLabel(label:String):TweenLiteVars Tweens a MovieClip to a particular frame. | TweenLiteVars | ||
glowFilter(blurX:Number = 10, blurY:Number = 10, color:uint = 0xFFFFFF, alpha:Number = 1, strength:Number = 2, inner:Boolean = false, knockout:Boolean = false, quality:uint = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a GlowFilter
| TweenLiteVars | ||
height(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "height" property of the target | TweenLiteVars | ||
hexColors(values:Object):TweenLiteVars
Although hex colors are technically numbers, if you try to tween them conventionally,
you'll notice that they don't tween smoothly. | TweenLiteVars | ||
immediateRender(value:Boolean):TweenLiteVars
Normally when you create a tween, it begins rendering on the very next frame (when
the Flash Player dispatches an ENTER_FRAME event) unless you specify a delay. | TweenLiteVars | ||
motionBlur(strength:Number = 1, fastMode:Boolean = false, quality:int = 2, padding:int = 10):TweenLiteVars
MotionBlurPlugin provides an easy way to apply a directional blur to a DisplayObject based on its velocity
and angle of movement in 2D (x/y). | TweenLiteVars | ||
move(x:Number, y:Number, relative:Boolean = false):TweenLiteVars Tweens the "x" and "y" properties of the target | TweenLiteVars | ||
onComplete(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween has completed. | TweenLiteVars | ||
onCompleteRender(func:Function, params:Array = null):TweenLiteVars
A function that should be called after the tween has completed and rendered its final state to the stage (waits for the next ENTER_FRAME event is dispatched after the tween finishes). | TweenLiteVars | ||
onReverseComplete(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween has reached its starting point again after having been reversed. | TweenLiteVars | ||
onStart(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween begins (when its time() is at 0
and changes to some other value which can happen more than once if the tween is restarted multiple times). | TweenLiteVars | ||
onUpdate(func:Function, params:Array = null):TweenLiteVars
A function to call whenever the tweening values are updated (on every frame during the time the tween is active). | TweenLiteVars | ||
orientToBezier(values:Object = null):TweenLiteVars
A common effect that designers/developers want is for a MovieClip/Sprite to orient itself in the direction of
a Bezier path (alter its rotation). | TweenLiteVars | ||
overwrite(value:String):TweenLiteVars
Controls how (and if) other tweens of the same target are overwritten. | TweenLiteVars | ||
paused(value:Boolean):TweenLiteVars Controls the paused state of the tween - if true, the tween will be paused initially. | TweenLiteVars | ||
physics2D(velocity:Number, angle:Number, acceleration:Number = 0, accelerationAngle:Number = 90, friction:Number = 0):TweenLiteVars
Provides simple physics functionality for tweening a DisplayObject's x and y coordinates based on a
combination of velocity, angle, gravity, acceleration, accelerationAngle, and/or friction. | TweenLiteVars | ||
physicsProps(values:Object):TweenLiteVars
Sometimes you want to tween a property (or several) but you don't have a specific end value in mind - instead,
you'd rather describe the movement in terms of physics concepts, like velocity, acceleration,
and/or friction. | TweenLiteVars | ||
prop(property:String, value:Number, relative:Boolean = false):TweenLiteVars
Adds a dynamic property for tweening and allows you to indicate whether the value is relative or not. | TweenLiteVars | ||
quaternions(values:Object):TweenLiteVars An object with properties that correspond to the quaternion properties of the target object. | TweenLiteVars | ||
removeTint(remove:Boolean = true):TweenLiteVars Removes the tint of a DisplayObject over time. | TweenLiteVars | ||
rotation(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "rotation" property of the target | TweenLiteVars | ||
runBackwards(value:Boolean):TweenLiteVars When true, the tween will flip the start and end values which is exactly what TweenLite.from() does. | TweenLiteVars | ||
scale(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "scaleX" and "scaleY" properties of the target | TweenLiteVars | ||
scaleX(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "scaleX" property of the target | TweenLiteVars | ||
scaleY(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "scaleY" property of the target | TweenLiteVars | ||
scrollRect(props:Object):TweenLiteVars
Tweens the scrollRect property of a DisplayObject. | TweenLiteVars | ||
setSize(width:Number, height:Number):TweenLiteVars
Some components require resizing with setSize() instead of standard tweens of width/height in
order to scale properly. | TweenLiteVars | ||
shortRotation(values:Object):TweenLiteVars
To tween any rotation property of the target object in the shortest direction, use "shortRotation"
For example, if myObject.rotation is currently 170 degrees and you want to tween it to
-170 degrees, a normal rotation tween would travel a total of 340 degrees in the counter-clockwise
direction, but if you use shortRotation, it would travel 20 degrees in the clockwise direction instead. | TweenLiteVars | ||
soundTransform(volume:Number = 1, pan:Number = 0, leftToLeft:Number = 1, leftToRight:Number = 0, rightToLeft:Number = 0, rightToRight:Number = 1):TweenLiteVars
Tweens properties of an object's soundTransform property (like the volume, pan, leftToRight, etc. | TweenLiteVars | ||
stageQuality(stage:Stage, during:String = medium, after:String = null):TweenLiteVars
Sets the stage's quality to a particular value during a tween and another value after
the tween which can be useful for improving rendering performance in the Flash Player while things are animating. | TweenLiteVars | ||
throwProps(props:Object):TweenLiteVars
Allows you to define an initial velocity at which a property (or multiple properties) will start tweening,
as well as [optional] maximum and/or minimum end values and then it will calculate the appropriate landing
position and plot a smooth course to it based on the easing equation you define (Quad.easeOut by default,
as set in TweenLite). | TweenLiteVars | ||
tint(color:uint):TweenLiteVars
To change a DisplayObject's tint, set this to the hex value of the color you'd like the DisplayObject
to end up at (or begin at if you're using TweenLite.from()). | TweenLiteVars | ||
transformAroundCenter(props:Object):TweenLiteVars
Normally, all transformations (scale, rotation, and position) are based on the DisplayObject's registration
point (most often its upper left corner), but TransformAroundCenter allows you to make the transformations
occur around the DisplayObject's center. | TweenLiteVars | ||
transformAroundPoint(point:Point, props:Object):TweenLiteVars
Normally, all transformations (scale, rotation, and position) are based on the DisplayObject's registration
point (most often its upper left corner), but TransformAroundPoint allows you to define ANY point around which
transformations will occur during the tween. | TweenLiteVars | ||
transformMatrix(properties:Object):TweenLiteVars
transformMatrix tweens a DisplayObject's transform.matrix values directly either using
the standard matrix properties (a, b, c, d, tx, and ty) or common properties
like x, y, scaleX, scaleY, skewX, skewY, rotation and even shortRotation. | TweenLiteVars | ||
useFrames(value:Boolean):TweenLiteVars
If useFrames is set to true, the tweens's timing mode will be based on frames. | TweenLiteVars | ||
visible(value:Boolean):TweenLiteVars Sets a DisplayObject's "visible" property at the end of the tween. | TweenLiteVars | ||
volume(volume:Number):TweenLiteVars Changes the volume of any object that has a soundTransform property (MovieClip, SoundChannel, NetStream, etc.) | TweenLiteVars | ||
width(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "width" property of the target | TweenLiteVars | ||
x(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "x" property of the target | TweenLiteVars | ||
y(value:Number, relative:Boolean = false):TweenLiteVars Tweens the "y" property of the target | TweenLiteVars |
vars | property |
vars:Object
[read-only] The generic object populated by all of the method calls in the TweenLiteVars instance. This is the raw data that gets passed to the tween.
public function get vars():Object
TweenLiteVars | () | Constructor |
public function TweenLiteVars(vars:Object = null)
Constructor
Parametersvars:Object (default = null ) — A generic Object containing properties that you'd like added (copied) to this TweenLiteVars instance. This is particularly useful for generic properties that don't have a corresponding method for setting the values (although you can use it for properties that do have corresponding methods too). For example, to tween the x and y properties of a DisplayObject, new TweenLiteVars({x:300, y:0})
|
autoAlpha | () | method |
public function autoAlpha(alpha:Number):TweenLiteVars
Same as changing the "alpha" property but with the additional feature of toggling the "visible" property to false whenever alpha is 0, thus improving rendering performance in the Flash Player.
Parameters
alpha:Number |
TweenLiteVars |
bevelFilter | () | method |
public function bevelFilter(distance:Number = 4, angle:Number = 45, highlightColor:uint = 0xFFFFFF, highlightAlpha:Number = 0.5, shadowColor:uint = 0x000000, shadowAlpha:Number = 0.5, blurX:Number = 4, blurY:Number = 4, strength:Number = 1, quality:int = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a BevelFilter
Parameters
distance:Number (default = 4 ) — The offset distance of the bevel.
| |
angle:Number (default = 45 ) — The angle of the bevel.
| |
highlightColor:uint (default = 0xFFFFFF ) — The highlight color of the bevel.
| |
highlightAlpha:Number (default = 0.5 ) — The alpha transparency value of the highlight color.
| |
shadowColor:uint (default = 0x000000 ) — The shadow color of the bevel.
| |
shadowAlpha:Number (default = 0.5 ) — The alpha transparency value of the shadow color.
| |
blurX:Number (default = 4 ) — The amount of horizontal blur, in pixels.
| |
blurY:Number (default = 4 ) — The amount of vertical blur, in pixels.
| |
strength:Number (default = 1 ) — The strength of the imprint or spread.
| |
quality:int (default = 2 ) — The number of times to apply the filter.
| |
remove:Boolean (default = false ) — If true, the filter will be removed as soon as the tween completes
| |
addFilter:Boolean (default = false ) — If true, a new BevelFilter will be added to the target even if a BevelFilter is already in its filters array.
| |
index:int (default = -1 ) — Allows you to target a particular BevelFilter if there are multiple BevelFilters in the target's filters array - simply define the index value corresponding to the BevelFilter's position in the filters array.
|
TweenLiteVars — The TweenLiteVars instance
|
bezier | () | method |
public function bezier(values:Array):TweenLiteVars
Bezier tweening allows you to tween in a non-linear way. For example, you may want to tween a MovieClip's position from the origin (0,0) 500 pixels to the right (500,0) but curve downwards through the middle of the tween. Simply pass as many objects in the bezier Array as you'd like, one for each "control point" (see documentation on Flash's curveTo() drawing method for more about how control points work).
Keep in mind that you can bezier tween ANY properties, not just x/y.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.BezierPlugin; TweenPlugin.activate([BezierPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 3, new TweenLiteVars().bezier([{x:250, y:50}, {x:500, y:0}])); //makes my_mc travel through 250,50 and end up at 500,0.
Parameters
values:Array — An array of objects with key/value pairs that define the bezier points like [{x:250, y:50}, {x:500, y:0}]
|
TweenLiteVars |
See also
bezierThrough | () | method |
public function bezierThrough(values:Array):TweenLiteVars
Identical to bezier except that instead of passing Bezier control point values, you pass values through which the Bezier values should move. This can be more intuitive than using control points.
Parameters
values:Array — An array of objects with key/value pairs that define the bezier points like [{x:250, y:50}, {x:500, y:0}]
|
TweenLiteVars |
See also
blurFilter | () | method |
public function blurFilter(blurX:Number, blurY:Number, quality:int = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a BlurFilter
Parameters
blurX:Number — The amount of horizontal blur.
| |
blurY:Number — The amount of vertical blur.
| |
quality:int (default = 2 ) — The number of times to perform the blur.
| |
remove:Boolean (default = false ) — If true, the filter will be removed as soon as the tween completes
| |
addFilter:Boolean (default = false ) — If true, a new BlurFilter will be added to the target even if a BlurFilter is already in its filters array.
| |
index:int (default = -1 ) — Allows you to target a particular BlurFilter if there are multiple BlurFilters in the target's filters array - simply define the index value corresponding to the BlurFilter's position in the filters array.
|
TweenLiteVars — The TweenLiteVars instance
|
circlePath2D | () | method |
public function circlePath2D(path:MotionPath, startAngle:Number, endAngle:Number, autoRotate:Boolean = false, direction:String = clockwise, extraRevolutions:uint = 0, rotationOffset:Number = 0, useRadians:Boolean = false):TweenLiteVars
Tweens an object along a CirclePath2D motion path in any direction (clockwise, counter-clockwise, or shortest).
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.*; import com.greensock.motionPaths.* TweenPlugin.activate([CirclePath2DPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. var circle:CirclePath2D = new CirclePath2D(150, 150, 100); TweenLite.to(mc, 2, new TweenLiteVars().circlePath2D(circle, 90, 270, false, Direction.CLOCKWISE, 2));
Parameters
path:MotionPath — The CirclePath2D instance to follow (com.greensock.motionPaths.CirclePath2D )
| |
startAngle:Number — The position at which the target should begin its rotation (described in degrees unless useRadians is true in which case it is described in radians). For example, to begin at the top of the circle, use 270 or -90 as the startAngle.
| |
endAngle:Number — The position at which the target should end its rotation (described in degrees unless useRadians is true in which case it is described in radians). For example, to end at the bottom of the circle, use 90 as the endAngle.
| |
autoRotate:Boolean (default = false ) — When autoRotate is true , the target will automatically be rotated so that it is oriented to the angle of the path. To offset this value (like to always add 90 degrees for example), use the rotationOffset property.
| |
direction:String (default = clockwise ) — The direction in which the target should travel around the path. Options are Direction.CLOCKWISE ("clockwise"), Direction.COUNTER_CLOCKWISE ("counterClockwise"), or Direction.SHORTEST ("shortest").
| |
extraRevolutions:uint (default = 0 ) — If instead of going directly to the endAngle, you want the target to travel one or more extra revolutions around the path before going to the endAngle, define that number of revolutions here.
| |
rotationOffset:Number (default = 0 ) — When autoRotate is true , this value will always be added to the resulting rotation of the target.
| |
useRadians:Boolean (default = false ) — If you prefer to define values in radians instead of degrees, set useRadians to true.
|
TweenLiteVars — The TweenLiteVars instance
|
colorMatrixFilter | () | method |
public function colorMatrixFilter(colorize:uint = 0xFFFFFF, amount:Number = 1, saturation:Number = 1, contrast:Number = 1, brightness:Number = 1, hue:Number = 0, threshold:Number = -1, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
ColorMatrixFilter tweening offers an easy way to tween a DisplayObject's saturation, hue, contrast, brightness, and colorization.
HINT: If you'd like to match the ColorMatrixFilter values you created in the Flash IDE on a particular object, you can get its matrix like this:
import flash.display.DisplayObject; import flash.filters.ColorMatrixFilter; function getColorMatrix(mc:DisplayObject):Array { var f:Array = mc.filters, i:uint; for (i = 0; i < f.length; i++) { if (f[i] is ColorMatrixFilter) { return f[i].matrix; } } return null; } var myOriginalMatrix:Array = getColorMatrix(my_mc); //store it so you can tween back to it anytime
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.ColorMatrixFilterPlugin; TweenPlugin.activate([ColorMatrixFilterPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().colorMatrixFilter(0xFF0000));
Parameters
colorize:uint (default = 0xFFFFFF ) — The color to use for the colorizing effect - colorizing a DisplayObject makes it look as though you're seeing it through a colored piece of glass whereas tinting it makes every pixel exactly that color. You can control the amount of colorization using the "amount" parameter where 1 is full strength, 0.5 is half-strength, and 0 has no colorization effect.
| |
amount:Number (default = 1 ) — A number between 0 and 1 that determines the potency of the colorize effect. This parameter is ignored if the colorize parameter is left at its default value of 0xFFFFFF.
| |
saturation:Number (default = 1 ) — A number indicating the saturation where 1 is normal saturation, 0 makes the target look grayscale, and 2 would be double the normal saturation.
| |
contrast:Number (default = 1 ) — A number indicating the contrast where 1 is normal contrast, 0 is no contrast, and 2 is double the normal contrast, etc.
| |
brightness:Number (default = 1 ) — A number indicating the brightness where 1 is normal brightness, 0 is much darker than normal, and 2 is twice the normal brightness, etc.
| |
hue:Number (default = 0 ) — An angle-like number between 0 and 360 indicating the change in hue. Think of it as degrees, so 180 would be rotating the hue to be exactly opposite as normal, 360 would be the same as 0, etc.
| |
threshold:Number (default = -1 ) — A number from 0 to 255 that controls the threshold of where the pixels turn white or black (leave as -1 to avoid any threshold effect whatsoever).
| |
remove:Boolean (default = false ) — If true, the filter will be removed as soon as the tween completes
| |
addFilter:Boolean (default = false ) — If true, a new ColorMatrixFilter will be added to the target even if a ColorMatrixFilter is already in its filters array.
| |
index:int (default = -1 ) — Allows you to target a particular ColorMatrixFilter if there are multiple ColorMatrixFilters in the target's filters array - simply define the index value corresponding to the ColorMatrixFilter's position in the filters array.
|
TweenLiteVars — The TweenLiteVars instance
|
colorTransform | () | method |
public function colorTransform(tint:Number, tintAmount:Number, exposure:Number, brightness:Number, redMultiplier:Number, greenMultiplier:Number, blueMultiplier:Number, alphaMultiplier:Number, redOffset:Number, greenOffset:Number, blueOffset:Number, alphaOffset:Number):TweenLiteVars
Tweens ColorTransform properties of a DisplayObject to do advanced effects like overexposing, altering the brightness or setting the percent/amount of tint.
Parameters
tint:Number (default = NaN ) — The color value for a ColorTransform object.
| |
tintAmount:Number (default = NaN ) — A numeric value between 0 and 1 indicating the potency of the tint. For example, if tint is 0xFF0000 and tintAmount is 0.5, the target would be tinted halfway to red.
| |
exposure:Number (default = NaN ) — A numeric value between 0 and 2 where 1 is normal exposure, 0, is completely underexposed, and 2 is completely overexposed. Overexposing an object is different then changing the brightness - it seems to almost bleach the image and looks more dynamic and interesting (subjectively speaking).
| |
brightness:Number (default = NaN ) — A numeric value between 0 and 2 where 1 is normal brightness, 0 is completely dark/black, and 2 is completely bright/white
| |
redMultiplier:Number (default = NaN ) — A decimal value that is multiplied with the red channel value.
| |
greenMultiplier:Number (default = NaN ) — A decimal value that is multiplied with the green channel value.
| |
blueMultiplier:Number (default = NaN ) — A decimal value that is multiplied with the blue channel value.
| |
alphaMultiplier:Number (default = NaN ) — A decimal value that is multiplied with the alpha transparency channel value.
| |
redOffset:Number (default = NaN ) — A number from -255 to 255 that is added to the red channel value after it has been multiplied by the redMultiplier value.
| |
greenOffset:Number (default = NaN ) — A number from -255 to 255 that is added to the green channel value after it has been multiplied by the greenMultiplier value.
| |
blueOffset:Number (default = NaN ) — A number from -255 to 255 that is added to the blue channel value after it has been multiplied by the blueMultiplier value.
| |
alphaOffset:Number (default = NaN ) — A number from -255 to 255 that is added to the alpha transparency channel value after it has been multiplied by the alphaMultiplier value.
|
TweenLiteVars — The TweenLiteVars instance
|
data | () | method |
public function data(data:*):TweenLiteVars
Any generic data that you'd like associated with your tween.
Parameters
data:* |
TweenLiteVars |
delay | () | method |
public function delay(delay:Number):TweenLiteVars
The number of seconds (or frames for frames-based tweens) to delay before the tween begins.
Parameters
delay:Number |
TweenLiteVars |
dropShadowFilter | () | method |
public function dropShadowFilter(distance:Number = 4, blurX:Number = 4, blurY:Number = 4, alpha:Number = 1, angle:Number = 45, color:uint = 0x000000, strength:Number = 2, inner:Boolean = false, knockout:Boolean = false, hideObject:Boolean = false, quality:uint = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a DropShadowFilter.
Parameters
distance:Number (default = 4 ) — The offset distance for the shadow, in pixels.
| |
blurX:Number (default = 4 ) — The amount of horizontal blur.
| |
blurY:Number (default = 4 ) — The amount of vertical blur.
| |
alpha:Number (default = 1 ) — The alpha transparency value for the shadow color.
| |
angle:Number (default = 45 ) — The angle of the shadow.
| |
color:uint (default = 0x000000 ) — The color of the shadow.
| |
strength:Number (default = 2 ) — The strength of the imprint or spread.
| |
inner:Boolean (default = false ) — Indicates whether or not the shadow is an inner shadow.
| |
knockout:Boolean (default = false ) — Applies a knockout effect (true), which effectively makes the object's fill transparent and reveals the background color of the document.
| |
hideObject:Boolean (default = false ) — Indicates whether or not the object is hidden.
| |
quality:uint (default = 2 ) — The number of times to apply the filter.
| |
remove:Boolean (default = false ) — If true, the filter will be removed as soon as the tween completes
| |
addFilter:Boolean (default = false ) — If true, a new DropShadowFilter will be added to the target even if a DropShadowFilter is already in its filters array.
| |
index:int (default = -1 ) — Allows you to target a particular DropShadowFilter if there are multiple DropShadowFilters in the target's filters array - simply define the index value corresponding to the DropShadowFilter's position in the filters array.
|
TweenLiteVars — The TweenLiteVars instance
|
dynamicProps | () | method |
public function dynamicProps(props:Object, params:Object = null):TweenLiteVars
If you'd like to tween something to a destination value that may change at any time, dynamicProps allows you to simply associate a function with a property so that every time the tween is rendered, it calls that function to get the new destination value for the associated property. For example, if you want a MovieClip to tween to wherever the mouse happens to be, you could do:
TweenLite.to(mc, 3, new TweenLiteVars().dynamicProps({x:getMouseX, y:getMouseY})); function getMouseX():Number { return this.mouseX; } function getMouseY():Number { return this.mouseY; }
Of course you can get as complex as you want inside your custom function, as long as it returns the destination value, TweenLite/Max will take care of adjusting things on the fly.
You can optionally pass any number of parameters to functions using the "params" parameter like so:
TweenLite.to(mc, 3, new TweenLiteVars().dynamicProps({x:myFunction, y:myFunction}, {x:[mc2, "x"], y:[mc2, "y"]})); function myFunction(object:MovieClip, propName:String):Number { return object[propName]; }
DynamicPropsPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.*; TweenPlugin.activate([DynamicPropsPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(my_mc, 3, new TweenLiteVars().dynamicProps({x:getMouseX, y:getMouseY})); function getMouseX():Number { return this.mouseX; } function getMouseY():Number { return this.mouseY; }
Parameters
props:Object — An object containing properties that are named cooresponding to the properties of the target that should be affected, and the value should point to the function that handles returning the appropriate value, like {x:getMouseX, y:getMouseY} .
| |
params:Object (default = null ) — An object containing properties that are named corresponding to the properties of the target that should be affected, and the value should be an array of parameters that are passed to the corresponding function, like {x:[mc, "param2"], y:[mc, "param2"]}
|
TweenLiteVars — self
|
ease | () | method |
public function ease(ease:*, easeParams:Array = null):TweenLiteVars
Controls the rate of change. Use any standard easing equation like ElasticOut.ease
. The Default is QuadOut.ease
.
Parameters
ease:* — An ease (i.e. com.greensock.easing.ElasticOut.ease ) The default is QuadOut.ease .
| |
easeParams:Array (default = null ) — An Array of extra parameter values to feed the easing equation (beyond the standard 4). This can be useful with easing equations like Elastic that accept extra parameters like the amplitude and period. Most easing equations, however, don't accept extra parameters so you won't need to pass in any easeParams.
|
TweenLiteVars |
endArray | () | method |
public function endArray(values:Array):TweenLiteVars
An Array containing numeric end values of the target Array. Keep in mind that the target of the tween must be an Array with at least the same length as the endArray.
Parameters
values:Array |
TweenLiteVars |
frame | () | method |
public function frame(value:int, relative:Boolean = false):TweenLiteVars
Tweens a MovieClip to a particular frame.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.FramePlugin; TweenPlugin.activate([FramePlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().frame(125));
Note: When tweening the frames of a MovieClip, any audio that is embedded on the MovieClip's timeline (as "stream") will not be played. Doing so would be impossible because the tween might speed up or slow down the MovieClip to any degree.
Parameters
value:int — The frame to which the MovieClip should be tweened (or if relative is true , this value would represent the number of frames to travel from the current frame)
| |
relative:Boolean (default = false ) — If true , the frame value will be interpreted as relative to the current frame. So for example, if the MovieClip is at frame 5 currently and frame(10, true) is used, the MovieClip will tween 10 frames and end up on frame 15.
|
TweenLiteVars |
frameBackward | () | method |
public function frameBackward(frame:int):TweenLiteVars
Tweens a MovieClip backward to a particular frame number, wrapping it if/when it reaches the beginning of the timeline. For example, if your MovieClip has 20 frames total and it is currently at frame 10 and you want tween to frame 15, a normal frame tween would go forward from 10 to 15, but a frameBackward would go from 10 to 1 (the beginning) and wrap to the end and continue tweening from 20 to 15.
Parameters
frame:int |
TweenLiteVars |
frameForward | () | method |
public function frameForward(frame:int):TweenLiteVars
Tweens a MovieClip forward to a particular frame number, wrapping it if/when it reaches the end of the timeline. For example, if your MovieClip has 20 frames total and it is currently at frame 10 and you want tween to frame 5, a normal frame tween would go backwards from 10 to 5, but a frameForward would go from 10 to 20 (the end) and wrap to the beginning and continue tweening from 1 to 5.
Parameters
frame:int |
TweenLiteVars |
frameLabel | () | method |
public function frameLabel(label:String):TweenLiteVars
Tweens a MovieClip to a particular frame.
Parameters
label:String |
TweenLiteVars |
glowFilter | () | method |
public function glowFilter(blurX:Number = 10, blurY:Number = 10, color:uint = 0xFFFFFF, alpha:Number = 1, strength:Number = 2, inner:Boolean = false, knockout:Boolean = false, quality:uint = 2, remove:Boolean = false, addFilter:Boolean = false, index:int = -1):TweenLiteVars
Tweens a GlowFilter
Parameters
blurX:Number (default = 10 ) — The amount of horizontal blur.
| |
blurY:Number (default = 10 ) — The amount of vertical blur.
| |
color:uint (default = 0xFFFFFF ) — The color of the glow.
| |
alpha:Number (default = 1 ) — The alpha transparency value for the color.
| |
strength:Number (default = 2 ) — The strength of the imprint or spread.
| |
inner:Boolean (default = false ) — Specifies whether the glow is an inner glow.
| |
knockout:Boolean (default = false ) — Specifies whether the object has a knockout effect.
| |
quality:uint (default = 2 ) — The number of times to apply the filter.
| |
remove:Boolean (default = false ) — If true, the filter will be removed as soon as the tween completes
| |
addFilter:Boolean (default = false ) — If true, a new GlowFilter will be added to the target even if a GlowFilter is already in its filters array.
| |
index:int (default = -1 ) — Allows you to target a particular GlowFilter if there are multiple GlowFilters in the target's filters array - simply define the index value corresponding to the GlowFilter's position in the filters array.
|
TweenLiteVars — The TweenLiteVars instance
|
height | () | method |
public function height(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "height" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
hexColors | () | method |
public function hexColors(values:Object):TweenLiteVars
Although hex colors are technically numbers, if you try to tween them conventionally,
you'll notice that they don't tween smoothly. To tween them properly, the red, green, and
blue components must be extracted and tweened independently. The HexColorsPlugin makes it easy.
To tween a property of your object that's a hex color to another hex color, just pass a hexColors
Object with properties named the same as your object's hex color properties. For example,
if myObject has a "myHexColor" property that you'd like to tween to red (0xFF0000
) over the
course of 2 seconds, you'd do:
TweenMax.to(myObject, 2, new TweenLiteVars().hexColors({myHexColor:0xFF0000}));
You can pass in any number of hexColor properties.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.HexColorsPlugin; TweenPlugin.activate([HexColorsPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(myObject, 2, new TweenLiteVars().hexColors({myHexColor:0xFF0000}));
Or if you just want to tween a color and apply it somewhere on every frame, you could do:
var myColor:Object = {hex:0xFF0000}; TweenLite.to(myColor, 2, new TweenLiteVars().hexColors({hex:0x0000FF}).onUpdate(applyColor)); function applyColor():void { mc.graphics.clear(); mc.graphics.beginFill(myColor.hex, 1); mc.graphics.drawRect(0, 0, 100, 100); mc.graphics.endFill(); }
Parameters
values:Object |
TweenLiteVars |
immediateRender | () | method |
public function immediateRender(value:Boolean):TweenLiteVars
Normally when you create a tween, it begins rendering on the very next frame (when
the Flash Player dispatches an ENTER_FRAME event) unless you specify a delay
.
This allows you to insert tweens into timelines and perform other actions that may affect
its timing. However, if you prefer to force the tween to render immediately when it is
created, set immediateRender
to true. from() tweens
render immediately by default, so to prevent that behavior, set immediateRender
to false
.
Parameters
value:Boolean |
TweenLiteVars |
motionBlur | () | method |
public function motionBlur(strength:Number = 1, fastMode:Boolean = false, quality:int = 2, padding:int = 10):TweenLiteVars
MotionBlurPlugin provides an easy way to apply a directional blur to a DisplayObject based on its velocity and angle of movement in 2D (x/y). This creates a much more realistic effect than a standard BlurFilter for several reasons:
Strong.easeInOut
for example, the strength of the blur will start out low, then increase as the object moves faster, and
reduce again towards the end of the tween.motionBlur even works on bezier/bezierThrough tweens!
To accomplish the effect, MotionBlurPlugin creates a Bitmap that it places over the original object, changing
alpha of the original to [almost] zero during the course of the tween. The original DisplayObject still follows the
course of the tween, so MouseEvents are properly dispatched. You shouldn't notice any loss of interactivity.
The DisplayObject can also have animated contents - MotionBlurPlugin automatically updates on every frame.
Be aware, however, that as with most filter effects, MotionBlurPlugin is somewhat CPU-intensive, so it is not
recommended that you tween large quantities of objects simultaneously. You can activate fastMode
to significantly speed up rendering if the object's contents and size/color doesn't need to change during the
course of the tween.
Parameters
strength:Number (default = 1 ) — Determines the strength of the blur. The default is 1. For a more powerful blur, increase the number. Or reduce it to make the effect more subtle.
| |
fastMode:Boolean (default = false ) — Setting fastMode to true will significantly improve rendering performance but it is only appropriate for situations when the target object's contents, size, color, filters, etc. do not need to change during the course of the tween. It works by essentially taking a BitmapData snapshot of the target object at the beginning of the tween and then reuses that throughout the tween, blurring it appropriately. The default value for fastMode is false .
| |
quality:int (default = 2 ) — The lower the quality, the less CPU-intensive the effect will be. Options are 1, 2, or 3. The default is 2.
| |
padding:int (default = 10 ) — padding controls the amount of space around the edges of the target object that is included in the BitmapData capture (the default is 10 pixels). If the target object has filters applied to it like a GlowFilter or DropShadowFilter that extend beyond the bounds of the object itself, you might need to increase the padding to accommodate the filters.
|
TweenLiteVars — The TweenLiteVars instance
|
move | () | method |
public function move(x:Number, y:Number, relative:Boolean = false):TweenLiteVars
Tweens the "x" and "y" properties of the target
Parameters
x:Number | |
y:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
onComplete | () | method |
public function onComplete(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween has completed.
Parameters
func:Function — A function that should be called when the tween has completed.
| |
params:Array (default = null ) — An Array of parameters to pass the onComplete function
|
TweenLiteVars |
onCompleteRender | () | method |
public function onCompleteRender(func:Function, params:Array = null):TweenLiteVars
A function that should be called after the tween has completed and rendered its final state to the stage (waits for the next ENTER_FRAME event is dispatched after the tween finishes). Target must be a DisplayObject.
Parameters
func:Function — A function that should be called after the tween has completed and rendered its final state to the stage (waits for the next ENTER_FRAME event is dispatched after the tween finishes).
| |
params:Array (default = null ) — An Array of parameters to pass the onCompleteRender function
|
TweenLiteVars |
onReverseComplete | () | method |
public function onReverseComplete(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween has reached its starting point again after having been reversed.
Parameters
func:Function — A function that should be called when the tween has reached its starting point again after having been reversed.
| |
params:Array (default = null ) — An Array of parameters to pass the onReverseComplete function
|
TweenLiteVars |
onStart | () | method |
public function onStart(func:Function, params:Array = null):TweenLiteVars
A function that should be called when the tween begins (when its time()
is at 0
and changes to some other value which can happen more than once if the tween is restarted multiple times).
Parameters
func:Function — A function that should be called when the tween begins.
| |
params:Array (default = null ) — An Array of parameters to pass the onStart function.
|
TweenLiteVars |
onUpdate | () | method |
public function onUpdate(func:Function, params:Array = null):TweenLiteVars
A function to call whenever the tweening values are updated (on every frame during the time the tween is active).
Parameters
func:Function — A function to call whenever the tweening values are updated.
| |
params:Array (default = null ) — An Array of parameters to pass the onUpdate function
|
TweenLiteVars |
orientToBezier | () | method |
public function orientToBezier(values:Object = null):TweenLiteVars
A common effect that designers/developers want is for a MovieClip/Sprite to orient itself in the direction of a Bezier path (alter its rotation). orientToBezier makes it easy. In order to alter a rotation property accurately, TweenLite/Max needs 4 pieces of information:
The orientToBezier property should be an Array containing one Array for each set of these values.
For maximum flexibility, you can pass in any number of Arrays inside the container Array, one for
each rotational property. This can be convenient when working in 3D because you can rotate on multiple axis.
If you're doing a standard 2D x/y tween on a bezier, you can simply pass in a boolean value of true and
TweenMax will use a typical setup, [["x", "y", "rotation", 0]]
.
Hint: Don't forget the container Array (notice the double outer brackets)
To use the default value ([["x", "y", "rotation", 0]]
), you can simply leave the values parameter as null.
Parameters
values:Object (default = null )
|
TweenLiteVars |
overwrite | () | method |
public function overwrite(value:String):TweenLiteVars
Controls how (and if) other tweens of the same target are overwritten.
There are several modes to choose from, but "auto"
is the default (although
you can change the default mode using the TweenLite.defaultOverwrite
property):
"none"
- no overwriting will occur."all"
- immediately overwrites all existing
tweens of the same target even if they haven't started yet or don't have
conflicting properties."auto"
- when the tween renders for the first time, it will analyze
tweens of the same target that are currently active/running and only overwrite
individual tweening properties that overlap/conflict. Tweens that haven't begun
yet are ignored. For example, if another active tween is found that is tweening
3 properties, only 1 of which it shares in common with the new tween, the other
2 properties will be left alone. Only the conflicting property gets overwritten/killed.
This is the default mode and typically the most intuitive for developers."concurrent"
- when the tween renders for the first time, it kills
only the active (in-progress) tweens of the same target regardless of whether
or not they contain conflicting properties. Like a mix of "all"
and "auto"
. Good for situations where you only want one tween
controling the target at a time."allOnStart"
- Identical to "all"
but waits to run
the overwrite logic until the tween begins (after any delay). Kills
tweens of the same target even if they don't contain conflicting properties
or haven't started yet."preexisting"
- when the tween renders for the first time, it kills
only the tweens of the same target that existed BEFORE this tween was created
regardless of their scheduled start times. So, for example, if you create a tween
with a delay of 10 and then a tween with a delay of 1 and then a tween with a
delay of 2 (all of the same target), the 2nd tween would overwrite the first
but not the second even though scheduling might seem to dictate otherwise.
"preexisting"
only cares about the order in which the instances
were actually created. This can be useful when the order in which your code runs
plays a critical role.Parameters
value:String |
TweenLiteVars |
paused | () | method |
public function paused(value:Boolean):TweenLiteVars
Controls the paused state of the tween - if true, the tween will be paused initially.
Parameters
value:Boolean |
TweenLiteVars |
physics2D | () | method |
public function physics2D(velocity:Number, angle:Number, acceleration:Number = 0, accelerationAngle:Number = 90, friction:Number = 0):TweenLiteVars
Provides simple physics functionality for tweening a DisplayObject's x and y coordinates based on a combination of velocity, angle, gravity, acceleration, accelerationAngle, and/or friction. It is not intended to replace a full-blown physics engine and does not offer collision detection, but serves as a way to easily create interesting physics-based effects with the GreenSock tweening platform. Parameters are not intended to be dynamically updateable, but one unique convenience is that everything is reverseable. So if you spawn a bunch of particle tweens, for example, and throw them into a TimelineLite, you could simply call reverse() on the timeline to watch the particles retrace their steps right back to the beginning. Keep in mind that any easing equation you define for your tween will be completely ignored for these properties.
USAGE:
import com.greensock.TweenLite; import com.greensock.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.Physics2DPlugin; TweenPlugin.activate([Physics2DPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 2, new TweenLiteVars().physics2D(300, -60, 400));
Physics2DPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
Parameters
velocity:Number — The initial velocity of the object measured in pixels per time unit (usually seconds, but for tweens where useFrames is true, it would be measured in frames). The default is zero.
| |
angle:Number — The initial angle (in degrees) at which the object is traveling. Only pertinent when a velocity is defined. For example, if the object should start out traveling at -60 degrees (towards the upper right), the angle would be -60. The default is zero.
| |
acceleration:Number (default = 0 ) — The amount of acceleration applied to the object, measured in pixels per time unit (usually seconds, but for tweens where useFrames is true, it would be measured in frames). To apply the acceleration in a specific direction that is different than the angle , use the accelerationAngle property.
| |
accelerationAngle:Number (default = 90 ) — The angle at which acceleration is applied (if any), measured in degrees. So if, for example, you want the object to accelerate towards the left side of the screen, you'd use an accelerationAngle of 180.
| |
friction:Number (default = 0 ) — A value between 0 and 1 where 0 is no friction, 0.08 is a small amount of friction, and 1 will completely prevent any movement. This is not meant to be precise or scientific in any way, but rather serves as an easy way to apply a friction-like physics effect to your tween. Generally it is best to experiment with this number a bit. Also note that friction requires more processing than physics tweens without any friction.
|
TweenLiteVars — The TweenLiteVars instance
|
See also
physicsProps | () | method |
public function physicsProps(values:Object):TweenLiteVars
Sometimes you want to tween a property (or several) but you don't have a specific end value in mind - instead, you'd rather describe the movement in terms of physics concepts, like velocity, acceleration, and/or friction. physicsProps allows you to tween any numeric property of any object based on these concepts. Keep in mind that any easing equation you define for your tween will be completely ignored for these properties. Instead, the physics parameters will determine the movement/easing. These parameters, by the way, are not intended to be dynamically updateable, but one unique convenience is that everything is reverseable. So if you create several physics-based tweens, for example, and throw them into a TimelineLite, you could simply call reverse() on the timeline to watch the objects retrace their steps right back to the beginning. Here are the parameters you can define (note that friction and acceleration are both completely optional):
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.PhysicsPropsPlugin; TweenPlugin.activate([PhysicsPropsPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 2, new TweenLiteVars().physicsProps({ x:{velocity:100, acceleration:200}, y:{velocity:-200, friction:0.1} } ));
PhysicsPropsPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
Parameters
values:Object |
TweenLiteVars |
See also
prop | () | method |
public function prop(property:String, value:Number, relative:Boolean = false):TweenLiteVars
Adds a dynamic property for tweening and allows you to indicate whether the value is relative or not. For example, to tween "x" to 50 less than whatever it currently is:
prop("x", -50, true);
Parameters
property:String — Property name
| |
value:Number — Numeric end value (or beginning value for from() tweens)
| |
relative:Boolean (default = false ) — If true , the value will be interpreted as relative to the target's current value. For example, if mc.x is currently 300 and you do prop("x", 200, true) , the end value will be 500.
|
TweenLiteVars |
quaternions | () | method |
public function quaternions(values:Object):TweenLiteVars
An object with properties that correspond to the quaternion properties of the target object. For example, if your my3DObject has "orientation" and "childOrientation" properties that contain quaternions, and you'd like to tween them both, you'd do: {orientation:myTargetQuaternion1, childOrientation:myTargetQuaternion2}. Quaternions must have the following properties: x, y, z, and w.
Parameters
values:Object |
TweenLiteVars |
removeTint | () | method |
public function removeTint(remove:Boolean = true):TweenLiteVars
Removes the tint of a DisplayObject over time.
Parameters
remove:Boolean (default = true )
|
TweenLiteVars |
rotation | () | method |
public function rotation(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "rotation" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
runBackwards | () | method |
public function runBackwards(value:Boolean):TweenLiteVars
When true, the tween will flip the start and end values which is exactly what TweenLite.from()
does.
Parameters
value:Boolean |
TweenLiteVars |
scale | () | method |
public function scale(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "scaleX" and "scaleY" properties of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
scaleX | () | method |
public function scaleX(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "scaleX" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
scaleY | () | method |
public function scaleY(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "scaleY" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
scrollRect | () | method |
public function scrollRect(props:Object):TweenLiteVars
Tweens the scrollRect property of a DisplayObject. You can define any (or all) of the following properties:
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.ScrollRectPlugin; TweenPlugin.activate([ScrollRectPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().scrollRect({x:50, y:300, width:100, height:100}));
Parameters
props:Object |
TweenLiteVars |
setSize | () | method |
public function setSize(width:Number, height:Number):TweenLiteVars
Some components require resizing with setSize() instead of standard tweens of width/height in order to scale properly. The SetSizePlugin accommodates this easily. You can define the width, height, or both.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.SetSizePlugin; TweenPlugin.activate([SetSizePlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(myComponent, 1, new TweenLiteVars().setSize(200, 30));
Parameters
width:Number (default = NaN )
| |
height:Number (default = NaN )
|
TweenLiteVars |
shortRotation | () | method |
public function shortRotation(values:Object):TweenLiteVars
To tween any rotation property of the target object in the shortest direction, use "shortRotation"
For example, if myObject.rotation
is currently 170 degrees and you want to tween it to
-170 degrees, a normal rotation tween would travel a total of 340 degrees in the counter-clockwise
direction, but if you use shortRotation, it would travel 20 degrees in the clockwise direction instead.
You can define any number of rotation properties in the shortRotation object which makes 3D tweening
easier, like:
TweenLite.to(mc, 2, new TweenLiteVars().shortRotation({rotationX:-170, rotationY:35, rotationZ:200}));
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.ShortRotationPlugin; TweenPlugin.activate([ShortRotationPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().shortRotation({rotation:-170})); //or for a 3D tween with multiple rotation values... TweenLite.to(mc, 1, new TweenLiteVars().shortRotation({rotationX:-170, rotationY:35, rotationZ:10}));
Parameters
values:Object |
TweenLiteVars |
soundTransform | () | method |
public function soundTransform(volume:Number = 1, pan:Number = 0, leftToLeft:Number = 1, leftToRight:Number = 0, rightToLeft:Number = 0, rightToRight:Number = 1):TweenLiteVars
Tweens properties of an object's soundTransform property (like the volume, pan, leftToRight, etc. of a MovieClip/SoundChannel/NetStream).
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.SoundTransformPlugin; TweenPlugin.activate([SoundTransformPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().soundTransform(0.2, 0.5));
Parameters
volume:Number (default = 1 ) — The volume, ranging from 0 (silent) to 1 (full volume).
| |
pan:Number (default = 0 ) — The left-to-right panning of the sound, ranging from -1 (full pan left) to 1 (full pan right).
| |
leftToLeft:Number (default = 1 ) — A value, from 0 (none) to 1 (all), specifying how much of the left input is played in the left speaker.
| |
leftToRight:Number (default = 0 ) — A value, from 0 (none) to 1 (all), specifying how much of the left input is played in the right speaker.
| |
rightToLeft:Number (default = 0 ) — A value, from 0 (none) to 1 (all), specifying how much of the right input is played in the left speaker.
| |
rightToRight:Number (default = 1 ) — A value, from 0 (none) to 1 (all), specifying how much of the right input is played in the right speaker.
|
TweenLiteVars — The TweenLiteVars instance
|
stageQuality | () | method |
public function stageQuality(stage:Stage, during:String = medium, after:String = null):TweenLiteVars
Sets the stage's quality
to a particular value during a tween and another value after
the tween which can be useful for improving rendering performance in the Flash Player while things are animating.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.StageQualityPlugin; import flash.display.StageQuality; TweenPlugin.activate([StageQualityPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().prop("x", 100).stageQuality(this.stage, StageQuality.LOW, StageQuality.HIGH));
Parameters
stage:Stage — A reference to the stage
| |
during:String (default = medium ) — The stage quality that should be used during the tween
| |
after:String (default = null ) — The stage quality that should be set after the tween completes
|
TweenLiteVars — The TweenLiteVars instance
|
throwProps | () | method |
public function throwProps(props:Object):TweenLiteVars
Allows you to define an initial velocity at which a property (or multiple properties) will start tweening, as well as [optional] maximum and/or minimum end values and then it will calculate the appropriate landing position and plot a smooth course to it based on the easing equation you define (Quad.easeOut by default, as set in TweenLite). This is perfect for flick-scrolling or animating things as though they are being thrown.
In its simplest form, you can pass just the initial velocity for each property like this:
{x:500, y:-300}
In the above example, x
will animate at 500 pixels per second initially and
y
will animate at -300 pixels per second. Both will decelerate smoothly
until they come to rest based on the tween's duration.
To impose maximum and minimum boundaries on the end values, use the nested object syntax
with the max
and min
special properties like this:
{x:{velocity:500, max:1024, min:0}, y:{velocity:-300, max:720, min:0}};
Notice the nesting of the objects ({}). The max
and min
values refer
to the range for the final resting position (coordinates in this case), NOT the velocity.
So x
would always land between 0 and 1024 in this case, and y
would always land between 0 and 720. If you want the target object to land on a specific value
rather than within a range, simply set max
and min
to identical values.
Also notice that you must define a velocity
value for each property in the object syntax.
throwProps
isn't just for tweening x and y coordinates. It works with any numeric
property, so you could use it for spinning the rotation
of an object as well. Or the
scaleX
/scaleY
properties. Maybe the user drags to spin a wheel and
lets go and you want it to continue increasing the rotation
at that velocity,
decelerating smoothly until it stops.
ThrowPropsPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
Parameters
props:Object |
TweenLiteVars |
tint | () | method |
public function tint(color:uint):TweenLiteVars
To change a DisplayObject's tint, set this to the hex value of the color you'd like the DisplayObject to end up at (or begin at if you're using TweenLite.from()). An example hex value would be 0xFF0000. If you'd like to remove the tint from a DisplayObject, use the removeTint special property.
Parameters
color:uint |
TweenLiteVars |
See also
transformAroundCenter | () | method |
public function transformAroundCenter(props:Object):TweenLiteVars
Normally, all transformations (scale, rotation, and position) are based on the DisplayObject's registration point (most often its upper left corner), but TransformAroundCenter allows you to make the transformations occur around the DisplayObject's center.
If you define an x or y value in the transformAroundCenter object, it will correspond to the center which makes it easy to position (as opposed to having to figure out where the original registration point should tween to). If you prefer to define the x/y in relation to the original registration point, do so outside the transformAroundCenter object, like:
TweenLite.to(mc, 3, new TweenLiteVars().prop("x", 50).prop("y", 40).transformAroundCenter({scale:0.5, rotation:30}));
TransformAroundCenterPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.TransformAroundCenterPlugin; TweenPlugin.activate([TransformAroundCenterPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().transformAroundCenter({scale:1.5, rotation:150}));
Parameters
props:Object |
TweenLiteVars |
See also
transformAroundPoint | () | method |
public function transformAroundPoint(point:Point, props:Object):TweenLiteVars
Normally, all transformations (scale, rotation, and position) are based on the DisplayObject's registration point (most often its upper left corner), but TransformAroundPoint allows you to define ANY point around which transformations will occur during the tween. For example, you may have a dynamically-loaded image that you want to scale from its center or rotate around a particular point on the stage.
If you define an x or y value in the transformAroundPoint object, it will correspond to the custom registration point which makes it easy to position (as opposed to having to figure out where the original registration point should tween to). If you prefer to define the x/y in relation to the original registration point, do so outside the transformAroundPoint object, like:
TweenLite.to(mc, 3, new TweenLiteVars().prop("x", 50).prop("y", 40).transformAroundPoint(new Point(200, 300), {scale:0.5, rotation:30}));
TransformAroundPointPlugin is a Club GreenSock membership benefit. You must have a valid membership to use this class without violating the terms of use. Visit http://www.greensock.com/club/ to sign up or get more details.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.TransformAroundPointPlugin; TweenPlugin.activate([TransformAroundPointPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().transformAroundPoint(new Point(100, 300), {scaleX:2, scaleY:1.5, rotation:150}));
Parameters
point:Point | |
props:Object |
TweenLiteVars |
See also
transformMatrix | () | method |
public function transformMatrix(properties:Object):TweenLiteVars
transformMatrix tweens a DisplayObject's transform.matrix values directly either using
the standard matrix properties (a, b, c, d, tx, and ty
) or common properties
like x, y, scaleX, scaleY, skewX, skewY, rotation
and even shortRotation
.
To skew without adjusting scale visually, use skewX2 and skewY2 instead of skewX and skewY.
transformMatrix tween will affect all of the DisplayObject's transform properties, so do not use it in conjunction with regular x/y/scaleX/scaleY/rotation tweens concurrently.
USAGE:
import com.greensock.TweenLite; import com.greensock.data.TweenLiteVars; import com.greensock.plugins.TweenPlugin; import com.greensock.plugins.TransformMatrixPlugin; TweenPlugin.activate([TransformMatrixPlugin]); //activation is permanent in the SWF, so this line only needs to be run once. TweenLite.to(mc, 1, new TweenLiteVars().transformMatrix({x:50, y:300, scaleX:2, scaleY:2})); //-OR- TweenLite.to(mc, 1, new TweenLiteVars().transformMatrix({tx:50, ty:300, a:2, d:2}));
Parameters
properties:Object |
TweenLiteVars |
useFrames | () | method |
public function useFrames(value:Boolean):TweenLiteVars
If useFrames
is set to true, the tweens's timing mode will be based on frames.
Otherwise, it will be based on seconds/time. NOTE: a tween's timing mode is always
determined by its parent timeline.
Parameters
value:Boolean |
TweenLiteVars |
visible | () | method |
public function visible(value:Boolean):TweenLiteVars
Sets a DisplayObject's "visible" property at the end of the tween.
Parameters
value:Boolean |
TweenLiteVars |
volume | () | method |
public function volume(volume:Number):TweenLiteVars
Changes the volume of any object that has a soundTransform property (MovieClip, SoundChannel, NetStream, etc.)
Parameters
volume:Number |
TweenLiteVars |
width | () | method |
public function width(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "width" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
x | () | method |
public function x(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "x" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |
y | () | method |
public function y(value:Number, relative:Boolean = false):TweenLiteVars
Tweens the "y" property of the target
Parameters
value:Number | |
relative:Boolean (default = false )
|
TweenLiteVars |