Class: Ease

import * as PIXI from 'pixi.js'
import { Ease, ease } from 'pixi-ease'

const app = new PIXI.Application()
const test = app.stage.addChild(new PIXI.Sprite(PIXI.Texture.WHITE))

const move = ease.add(test, { x: 20, y: 15, alpha: 0.25 }, { reverse: true })
move.once('complete', () => console.log('move ease complete.'))

test.generic = 25
const generic = ease.add(test, { generic: 0 }, { duration: 1500, ease: 'easeOutQuad' })
generic.on('each', () => console.log(test.generic))

const secondEase = new Ease({ duration: 3000, ease: 'easeInBack' })
const test2 = app.stage.addChild(new PIXI.Sprite(PIXI.Texture.WHITE))
test2.tint = 0x0000ff
secondEase.add(test2, { blend: [0xff0000, 0x00ff00], scale: 2 })

Extends

• EventEmitter

Classes

Ease

Members

count number

number of easings

duration number

default duration for eases.add() (only applies to newly added eases)

ease string | function

default ease for eases.add() (only applies to newly added eases)

Methods

add (element, params, options)Easing

ease.js:110

add ease(s) to a PIXI.DisplayObject element

Name	Type	Description
element	PIXI.DisplayObject | Array.<PIXI.DisplayObject>
params	object	Name Type Description x number optional y number optional position PIXI.DisplayObject | PIXI.Point optional changes both x and y width number optional height number optional scale number optional changes both scale.x and scale.y scaleX number optional scaleY number optional alpha number optional rotation number optional face PIXI.DisplayObject | PIXI.Point optional rotate the element to face a DisplayObject using the closest angle skew number optional changes both skew.x and skew.y skewX number optional skewY number optional tint number | Array.<number> optional cycle through colors - if number is provided then it cycles between current tint and number; if number[] is provided is cycles only between tints in the number[] blend number | Array.<number> optional blend between colors - if number is provided then it blends current tint to number; if number[] is provided then it blends between the tints in the number[] shake number optional shakes the object by this number (randomly placing the element +/-shake pixels away from starting point) * number optional generic number parameter
options	object	optional Name Type Description duration number optional ease string | function optional repeat boolean | number optional reverse boolean optional wait number optional wait this number of milliseconds before ease starts

Returns:

Type	Description
Easing

countRunning ()number

ease.js:277

number of active easings across all elements

Returns:

Type	Description
number

destroy ()

ease.js:63

removes all eases and tickers

emit (event)Boolean inherited overrides

index.js:166

Calls each of the listeners registered for a given event.

Name	Type	Description
event	String | Symbol	The event name.

Returns:

Type	Description
Boolean	`true` if the event had listeners, else `false`.

eventNames ()Array inherited overrides

index.js:104

Return an array listing the events for which the emitter has registered listeners.

Returns:

Type	Description
Array

face (element, target, speed, options)Easing

ease.js:169

helper function to add an ease that changes rotation to face the element at the desired target using the speed NOTE: under the hood this calls add(element {x, y }, { duration: })

Name	Type	Description
element	PIXI.DisplayObject
target	PIXI.DisplayObject | PIXI.Point
speed	number	in radians / ms
options	object	optional Name Type Description ease string | function optional repeat boolean | number optional reverse boolean optional wait number optional wait this number of milliseconds before ease starts

Returns:

Type	Description
Easing

listenerCount (event)Number inherited overrides

index.js:150

Return the number of listeners listening to a given event.

Name	Type	Description
event	String | Symbol	The event name.

Returns:

Type	Description
Number	The number of listeners.

listeners (event)Array inherited overrides

index.js:129

Return the listeners registered for a given event.

Name	Type	Description
event	String | Symbol	The event name.

Returns:

Type	Description
Array	The registered listeners.

once (event, fn, context)EventEmitter inherited overrides

index.js:240

Add a one-time listener for a given event.

Name	Type	Default	Description
event	String | Symbol		The event name.
fn	function		The listener function.
context	*	this	optional The context to invoke the listener with.

Returns:

Type	Description
EventEmitter	`this`.

on (event, fn, context)EventEmitter inherited overrides

index.js:227

Add a listener for a given event.

Name	Type	Default	Description
event	String | Symbol		The event name.
fn	function		The listener function.
context	*	this	optional The context to invoke the listener with.

Returns:

Type	Description
EventEmitter	`this`.

removeAll ()

ease.js:209

remove all easings WARNING: 'complete' events will not fire for these removals

removeAllListeners (event)EventEmitter inherited overrides

index.js:301

Remove all listeners, or those of the specified event.

Name	Type	Description
event	String | Symbol	optional The event name.

Returns:

Type	Description
EventEmitter	`this`.

removeEase (element, param)

ease.js:184

removes one or more eases from a DisplayObject WARNING: 'complete' events will not fire for these removals

Name	Type	Description
element	PIXI.DisplayObject
param	string | Array.<string>	optional omit to remove all easings for an element

removeListener (event, fn, context, once)EventEmitter inherited overrides

index.js:254

Remove the listeners of a given event.

Name	Type	Description
event	String | Symbol	The event name.
fn	function	Only remove the listeners that match this function.
context	*	Only remove the listeners that have this context.
once	Boolean	Only remove one-time listeners.

Returns:

Type	Description
EventEmitter	`this`.

target (element, target, speed, options)Easing

ease.js:146

create an ease that changes position (x, y) of the element by moving to the target at the speed NOTE: under the hood this calls add(element, { x, y }, { duration: })

Name	Type	Description
element	PIXI.DisplayObject
target	PIXI.DisplayObject | PIXI.Point
speed	number	in pixels / ms
options	object	optional Name Type Description ease string | function optional repeat boolean | number optional reverse boolean optional wait number optional wait this number of milliseconds before ease starts removeExisting boolean optional removes existing eases on the element of the same type (including x,y/position, skewX,skewY/skew, scaleX,scaleY/scale)

Returns:

Type	Description
Easing

update (elapsed)

ease.js:224

update frame; this is called automatically if options.useTicker !== false

Name	Type	Description
elapsed	number	time in ms since last frame

Events

complete

ease.js:333

fires when there are no more eases

Type:

• Ease

each

ease.js:339

fires on each loop when there are eases running

Type:

• Ease