SpriteAnimation
A SpriteAnimation object contains a series of images (p5.Image objects) that can be displayed sequentially.
A sprite can have multiple labeled animations, see Sprite.addAnimation and Sprite.changeAnimation, but you can also create animations that can be used without being added to a sprite first.
An animation can be created either from a list of images or sequentially numbered images. p5.play will try to detect the sequence pattern.
For example if the image file path is "image1.png" and the last frame index is 3 then "image2.png" and "image3.png" will be loaded as well.
Table of Contents
Constructor
SpriteAnimation
()
Example:
let shapeShifter = new SpriteAnimation("dog.png", "cat.png", "snake.png"); let walking = new SpriteAnimation("walking0001.png", 5);
Methods
draw
-
x -
y -
r=0
Draws the animation at coordinate x and y. Updates the frames automatically.
Parameters:
-
xNumberx coordinate
-
yNumbery coordinate
-
[r=0]Number optionalrotation
getFrameImage
()
p5.Image
Returns the current frame image as p5.Image.
Returns:
Current frame image
getImageAt
-
frame
Returns the frame image at the specified frame number.
Parameters:
-
frameNumberFrame number
Returns:
Frame image
getWidth
()
Number
Use .w or .width instead.
Returns the current frame width in pixels. If there is no image loaded, returns 1.
Returns:
Frame width
goToFrame
-
toFrame
Plays the animation forward or backward toward a target frame.
Parameters:
-
toFrameNumberFrame number destination (starts from 0)
nextFrame
()
Goes to the next frame and stops.
play
()
Plays the animation.
previousFrame
()
Goes to the previous frame and stops.
rewind
()
Plays the animation backwards. Equivalent to ani.goToFrame(0)
stop
()
Stops the animation.
Properties
frame
Number
The index of the current frame that the animation is on.
frameChanged
Boolean
True if frame changed during the last draw cycle
frameDelay
Number
Delay between frames in number of draw cycles. If set to 4 the framerate of the animation would be the sketch framerate divided by 4 (60fps = 15fps)
Default: 4
images
Array
Array of frames (p5.Image)
looping
Boolean
If set to false the animation will stop after reaching the last frame
Default: true
name
String
The name of the animation
offset
Object x and y keys
The offset is how far the animation should be placed from the location it is played at.
Example:
offset.x = 16;
playing
Boolean
True if the animation is currently playing.
Default: true
visible
Boolean
Animation visibility.
Default: true