Touch Develop retirement postponed until June 22, 2019. Sign-in and access to cloud assets to be removed on May 23, 2018.Learn More..

Sprite Sheet

A sprite sheet allows to pack multiple sprite images into a single picture. You can find many tools on the web to create sprite sheets.

creating a sprite sheet

A sprite sheet has a picture and a set of frames associated to it. A frame identifies a region of the picture with a unique name.
Pass the picture to Board→create sprite sheet to add a new sprite sheet to your game board. This action also takes two optional arguments that specify the number of rows and columns of frames in the picture. This is useful when the frames are organized in a regular grid such as the explosion above.
var sheet := board → create sprite sheet( explosion)

adding frames

There are multiple ways to define frames in the sheet.
  • a regular grid of frames by specifying the number of rows and columns. The frames are numbered starting at 1.
sheet → set frame grid(4, 5, 0, 0, 0, 0, 0)
  • a single frame by specifying the top-left corner, width and height
sheet → add frame("hat", x, y, width, height, rotated)

create sprites

Once you've defined the frames in your sprite sheet, you can easily create a new sprite for any frame.
  • if you added a frame grid, the sprites are numbered starting from 1.
var sprite := sheet → create sprite("1")
  • if you have used add frame, simply use the name provided.
var hat sprite := sheet → create sprite("hat")

adding animations

As for frames, animations need to be added before used.
  • if the animation uses a sequences of sprites from a grid,
var start := 1
var duration := 1
var count := 5
var loops := 1
var yoyo := false
sheet → add grid animation("all", start, count, duration, loops, yoyo)
  • you can also specify an arbitrary sequence of frames as an animation. If you leave the duration as 0, the animation will assume 30 fps.
sheet → add animation("fast", "1,3,5,7,9" → split(","), 0, 1, false)

playing animations

Playing sprite sheet animation is done through sprite animation.
Start a new animation if needed.
var anim := sprite → create animation
and schedule to play a sprite sheet animation by name.
anim → play frames("fast")
You can override the repeat and yoyo values by using repeat.
anim → repeat(2, true)

importing sprite sheets

There exist many sprite sheet editors that support even more sprite sheet file formats. The following libraries provide importers for various tools: