Difference between revisions of "How to use a sprite sheet"

From MiniScript Wiki
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...")
 
Line 9: Line 9:
 
<ms>clear
 
<ms>clear
  
img = file.loadImage("/sys/pics/maelstrom/explosion.png")
+
// 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 img.getImage(i * 32, 0, 32, 32)
+
     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
Line 23: Line 25:
 
display(4).sprites.push explosion
 
display(4).sprites.push explosion
  
 +
// Main (animation) loop
 
while true
 
while true
 
     explosion.image = frames[time * animSpeed % frames.len]
 
     explosion.image = frames[time * animSpeed % frames.len]

Revision as of 18:30, 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
animSpeed = 10

display(4).sprites.push explosion

// Main (animation) loop
while true
    explosion.image = frames[time * animSpeed % frames.len]
    yield
end while

(Press Control-C to stop this program.)