Sprites

A Sprite component is a simple image or flipbook animation that is displayed on screen.

The Sprite component can use either an Atlas or a Tile Source for it’s graphics.

Sprite properties

Apart from the properties Id, Position and Rotation the following component specific properties exist:

Image

The atlas or tilesource resource to use for the sprite.

DefaultAnimation

The animation to use for the sprite.

Material

The material to use for rendering the sprite.

Blend Mode

The blend mode to use when rendering the sprite.

Blend modes

The Blend Mode property defines how the component graphics should be blended with the graphics behind it. These are the available blend modes and how they are calculated:

Alpha

Normal blending: src.a * src.rgb + (1 - src.a) * dst.rgb

Add

Brighten the background with the color values of the corresponding pixels of the component: src.rgb + dst.rgb

Multiply

Darken the background with values of the corresponding pixels of the component: src.rgb * dst.rgb

Screen

Opposite of Multiply. Brighten background and values of the corresponding pixels of the component: src.rgb - dst.rgb * dst.rgb

Runtime manipulation

You can manipulate sprites in runtime through a number of different functions and properties (refer to the API docs for usage). Functions:

• sprite.play_flipbook() - Play an animation on a sprite component.
• sprite.set_hflip() and sprite.set_vflip() - Set horizontal and vertical flipping on a sprite’s animation.

A sprite also has a number of different properties that can be manipulated using go.get() and go.set():

cursor

The normalized animation cursor (number).

image

The sprite image (hash). You can change this using an atlas or tile source resource property and go.set(). Refer to the API reference for an example.

material

The sprite material (hash). You can change this using a material resource property and go.set(). Refer to the API reference for an example.

playback_rate

The animation playback rate (number).

scale

The non-uniform scale of the sprite (vector3).

size

The size of the sprite (vector3) (READ ONLY).

Material constants

The default sprite material has the following constants that can be changed using go.set() or go.animate() (refer to the Material manual for more details). Examples:

go.set("#sprite", "tint", vmath.vector4(1,0,0,1))
go.animate("#sprite", "tint", go.PLAYBACK_LOOP_PINGPONG, vmath.vector4(1,0,0,1), go.EASING_LINEAR, 2)

tint

The color tint of the sprite (vector4). The vector4 is used to represent the tint with x, y, z, and w corresponding to the red, green, blue and alpha tint.

Project configuration

The game.project file has a few project settings related to sprites.