BitmapMovieClip Class
A class similar to createjs.MovieClip, but made to play animations from a cloudkid.TextureAtlas. The CreateJS Sprite class requires a spritesheet with equal sized and spaced frames. By using cloudkid.TextureAtlas, you can use a much smaller spritesheet, sprites on screen with fewer extra transparent pixels, and use the same API as MovieClip.
See "Export BitmapMovieClip.jsfl" in the library for a script that will export a selected MovieClip in the library with all of the information (except data.scale) needed to reassemble the BitmapMovieClip.
Constructor
BitmapMovieClip
-
atlas=null -
data=null -
[data.fps] -
[data.labels] -
[data.origin={x:0,y:0}] -
[data.frames] -
[data.frames.name] -
[data.frames.min] -
[data.frames.max] -
[data.frames.digits=4] -
[data.scale=1]
Parameters:
-
atlas=nullTextureAtlasThe texture atlas to pull frames from.
-
data=nullObjectInitialization data
-
[data.fps]Int optionalFramerate to play the movieclip at. Omitting this will use the current framerate.
-
[data.labels]Object optionalA dictionary of the labels in the movieclip to assist in playing animations.
-
[data.origin={x:0,y:0}]Object optionalThe origin of the movieclip.
-
[data.frames]Array optionalAn array of frame sequences to pull from the texture atlas.
-
[data.frames.name]String optionalThe name to use for the frame sequence. This should include a "#" to be replaced with the image number.
-
[data.frames.min]Int optionalThe first frame number in the frame sequence.
-
[data.frames.max]Int optionalThe last frame number in the frame sequence.
-
[data.frames.digits=4]Int optionalThe maximum number of digits in the names of the frames, e.g. myAnim0001 has 4 digits.
-
[data.scale=1]Number optionalThe scale at which the art was exported, e.g. a scale of 1.4 means the art was increased in size to 140% before exporting and should be scaled back down before drawing to the screen.
Format for data: { fps:30, labels: { animStart:0, animStart_loop:15 }, origin:{ x: 20, y:30 }, frames: [ { name:"myAnim#", min:1, max:20, digits:4 } ], scale:1 }
The object describes a 30 fps animation that is 20 frames long, and was originally myAnim0001.png->myAnim0020.png, with frame labels on the first and 16th frame. 'digits' is optional, and defaults to 4.
Item Index
Methods
Methods
_goto
-
positionOrLabel
_reset
()
private
_tick
-
props
Parameters:
-
propsObjectProperties to copy to the DisplayObject DisplayObject/tick event object. function.
_updateTimeline
()
protected
advance
-
[time]
Advances the playhead. This occurs automatically each tick by default.
Parameters:
-
[time]Number optionalThe amount of time in ms to advance by. Only applicable if framerate is set.
copyFrom
-
other
Copies the labels, textures, origin, and framerate from another BitmapMovieClip. The labels and textures are copied by reference, instead of a deep copy.
Parameters:
-
otherBitmapMovieClipThe movieclip to copy data from.
destroy
()
Destroys the BitmapMovieClip, removing all children and nulling all reference variables.
draw
-
ctx -
ignoreCache
Draws the display object into the specified context ignoring its visible, alpha, shadow, and transform. Returns true if the draw was handled (useful for overriding functionality). NOTE: This method is mainly for internal use, though it may be useful for advanced uses.
Parameters:
-
ctxCanvasRenderingContext2DThe canvas 2D context object to draw into.
-
ignoreCacheBooleanIndicates whether the draw operation should ignore any current cache. For example, used for drawing the cache (to prevent it from simply drawing an existing cache back into itself).
getCurrentLabel
()
String
Returns the name of the label on or immediately before the current frame. See TweenJS: Timeline.getCurrentLabel() for more information.
Returns:
The name of the current label or null if there is no label.
getLabels
()
ArrayObject
Returns a sorted list of the labels defined on this BitmapMovieClip. Shortcut to TweenJS: Timeline.getLabels();
Returns:
A sorted array of objects with label and position (aka frame) properties.
gotoAndPlay
-
positionOrLabel
Advances this movie clip to the specified position or label and sets paused to false.
gotoAndStop
-
positionOrLabel
Advances this movie clip to the specified position or label and sets paused to true.
init
-
atlas -
data
Returns the name of the label on or immediately before the current frame. See TweenJS: Timeline.getCurrentLabel() for more information.
Parameters:
-
atlasTextureAtlasThe texture atlas to pull frames from.
-
dataObjectInitialization data
-
[fps]Int optionalFramerate to play the movieclip at. Omitting this will use the current framerate.
-
[labels]Object optionalA dictionary of the labels in the movieclip to assist in playing animations.
-
[origin={x:0,y:0}]Object optionalThe origin of the movieclip.
-
[frames]Array optionalAn array of frame sequences to pull from the texture atlas.
-
[name]String optionalThe name to use for the frame sequence. This should include a "#" to be replaced with the image number. -
[min]Int optionalThe first frame number in the frame sequence. -
[max]Int optionalThe last frame number in the frame sequence. -
[digits=4]Int optionalThe maximum number of digits in the names of the frames, e.g. myAnim0001 has 4 digits.
-
-
[scale=1]Number optionalThe scale at which the art was exported, e.g. a scale of 1.4 means the art was increased in size to 140% before exporting and should be scaled back down before drawing to the screen.
Format for data: { fps:30, labels: { animStart:0, animStart_loop:15 }, origin:{ x: 20, y:30 }, frames: [ { name:"myAnim#", min:1, max:20, digits:4 } ] }
The object describes a 30 fps animation that is 20 frames long, and was originally myAnim0001.png->myAnim0020.png, with frame labels on the first and 16th frame. 'digits' is optional, and defaults to 4.
-
isVisible
()
Boolean
Returns true or false indicating whether the display object would be visible if drawn to a canvas. This does not account for whether it would be visible within the boundaries of the stage. NOTE: This method is mainly for internal use, though it may be useful for advanced uses.
Returns:
Boolean indicating whether the display object would be visible if drawn to a canvas
play
()
Sets paused to false.
stop
()
Sets paused to true.
Properties
_bitmap
createjs.Bitmap
private
The Bitmap used to render the current frame of the animation.
_currentTexture
cloudkid.TextureAtlas.Texture
private
The current texture.
_duration
Number
private
When the BitmapMovieClip is framerate independent, this is the total time in seconds for the animation.
Default: 0
_framerate
Number
private
By default BitmapMovieClip instances advance one frame per tick. Specifying a framerate for the BitmapMovieClip will cause it to advance based on elapsed time between ticks as appropriate to maintain the target framerate.
Default: 0
_origin
createjs.Point
private
The origin point of the BitmapMovieClip.
_scale
Number
private
A scale to apply to the images in the BitmapMovieClip to restore normal size (if spritesheet was exported at a smaller or larger size).
_t
Number
private
When the BitmapMovieClip is framerate independent, this is the time elapsed from frame 0 in seconds.
Default: 0
advanceDuringTicks
Boolean
If true, the BitmapMovieClip will advance its timeline during ticks. If false then it must be externally advanced.
Default: true
elapsedTime
Number
public
When the BitmapMovieClip is framerate independent, this is the time elapsed from frame 0 in seconds.
Default: 0
framerate
Number
By default BitmapMovieClip instances advance one frame per tick. Specifying a framerate for the BitmapMovieClip will cause it to advance based on elapsed time between ticks as appropriate to maintain the target framerate.
For example, if a BitmapMovieClip with a framerate of 10 is placed on a Stage being updated at 40fps, then the BitmapMovieClip will advance roughly one frame every 4 ticks. This will not be exact, because the time between each tick will vary slightly between frames.
This feature is dependent on the tick event object (or an object with an appropriate "delta" property) being passed into Stage/update.
Default: 0
loop
Boolean
Indicates whether this BitmapMovieClip should loop when it reaches the end of its timeline.
Default: true