Ani

Ani

new Ani()

Look at the Animation reference pages before reading these docs. An `Ani` object contains an array of images (Q5.Image objects) that can be displayed with the `animation` function or by being a sprite's animation. An animation can be created multiple ways, including from: - a list of image file paths as multiple input parameters - a sequence of numbered images by providing the file path to the first image frame and last frame index - a sprite sheet image path and atlas object, frame locator, or frame locators array (see the Learn page on Ani for more info) `Ani` is not a shorthand for `Animation`, since that class name is already used by the JS Web Animations API.
Source:
Parameters:
Name Type Attributes Description
...images p5.Image <repeatable>
 p5.Image objects to be used as frames
Example
let shapeShifter = new Ani("dog.png", "cat.png", "snake.png");

Extends

  • Array:.<p5.Image:>

Classes

Ani

Members

frame :Number

The index of the current frame that the animation is on.
Source:
Type:
  • Number

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 Value:
  • 4
Source:
Type:
  • Number

frameImage :p5.Image

The current frame as p5.Image. Read only.
Source:
Type:
  • p5.Image

h :Number

Height of the animation's current frame.
Source:
Type:
  • Number

height :Number

Height of the animation's current frame.
Source:
Type:
  • Number

lastFrame :Number

The index of the last frame. Read only.
Source:
Type:
  • Number

scale :Number|Object

The animation's scale. Can be set to a number to scale both x and y or an object with x and/or y properties.
Default Value:
  • 1
Source:
Type:
  • Number | Object

w :Number

Width of the animation's current frame.
Source:
Type:
  • Number

width :Number

Width of the animation's current frame.
Source:
Type:
  • Number

Methods

clone() → {Ani}

Make a copy of the animation.
Source:
Returns:
Type:
Ani
A copy of the animation.

draw(x, y, ropt, sxopt, syopt)

Draws the animation at coordinate x and y. Updates the frames automatically. Optional parameters effect the current draw cycle only and are not saved between draw cycles.
Source:
Parameters:
Name Type Attributes Description
x Number horizontal position
y Number vertical position
r Number <optional>
 rotation
sx Number <optional>
 scale x
sy Number <optional>
 scale y

goToFrame(toFrame)

Plays the animation forward or backward toward a target frame.
Source:
Parameters:
Name Type Description
toFrame Number Frame number destination (starts from 0)
Returns:
[Promise] a promise that resolves when the animation completes

loop()

Plays the animation forwards and loops it.
Source:

nextFrame()

Goes to the next frame and stops.
Source:

noLoop()

Prevents the animation from looping
Source:

pause()

Pauses the animation.
Source:

play()

Plays the animation, starting from the specified frame.
Source:
Returns:
[Promise] a promise that resolves when the animation completes

previousFrame()

Goes to the previous frame and stops.
Source:

rewind()

Plays the animation backwards. Equivalent to ani.goToFrame(0)
Source:
Returns:
[Promise] a promise that resolves when the animation completes rewinding

stop()

Stops the animation. Alt for pause.
Source: