Difference between revisions of "How to use a sprite sheet"
Jump to navigation
Jump to search
(Created page with "Often it is convenient to have a single image that contains many frames for a sprite. When played sequentially, these frames make the sprite appear to run, or explode, or wha...") |
|||
(One intermediate revision by the same user not shown) | |||
Line 9: | Line 9: | ||
<ms>clear | <ms>clear | ||
− | + | // Load and split up sprite sheet | |
+ | sheet = file.loadImage("/sys/pics/maelstrom/explosion.png") | ||
frames = [] | frames = [] | ||
for i in range(0, 9) | for i in range(0, 9) | ||
− | frames.push | + | frames.push sheet.getImage(i * 32, 0, 32, 32) |
end for | end for | ||
+ | // Prepare sprite | ||
explosion = new Sprite | explosion = new Sprite | ||
explosion.x = 128 | explosion.x = 128 | ||
explosion.y = 128 | explosion.y = 128 | ||
explosion.scale = 4 | explosion.scale = 4 | ||
− | |||
display(4).sprites.push explosion | display(4).sprites.push explosion | ||
+ | // Main (animation) loop | ||
+ | animSpeed = 10 // (adjust as desired) | ||
while true | while true | ||
explosion.image = frames[time * animSpeed % frames.len] | explosion.image = frames[time * animSpeed % frames.len] |
Latest revision as of 18:31, 7 July 2024
Often it is convenient to have a single image that contains many frames for a sprite. When played sequentially, these frames make the sprite appear to run, or explode, or whatever the images represent. A big image containing many smaller images (frames) is typically called a sprite sheet.
To use a sprite sheet, you must first pull the big image apart into a list of little images, using Image.getImage. Then you can assign these frames in turn to the Sprite image.
Example
The following example draws an explosion over and over, using a sprite sheet found in the Mini Micro system disk.
clear
// Load and split up sprite sheet
sheet = file.loadImage("/sys/pics/maelstrom/explosion.png")
frames = []
for i in range(0, 9)
frames.push sheet.getImage(i * 32, 0, 32, 32)
end for
// Prepare sprite
explosion = new Sprite
explosion.x = 128
explosion.y = 128
explosion.scale = 4
display(4).sprites.push explosion
// Main (animation) loop
animSpeed = 10 // (adjust as desired)
while true
explosion.image = frames[time * animSpeed % frames.len]
yield
end while
(Press Control-C to stop this program.)