This article describes using arrays of sprites in a Small Basic program. A sprite is an image that is moved in a graphical game, they may be aliens for example.
Often we want several copies of the sprites that come and go as the game proceeds and it is good practice to store them in arrays. This article provides some explanation and suggestions about how to dynamically control sprites efficiently.
The image for a sprite exists in a file (e.g. jpg or png). This file may be local as a file on your PC or be stored online as a URL. If it is local then you will need to share the images with your game in zip download, therefore it may be better to host
the file on the web if you can.
It is often best to create the sprite with a transparent boundary and with a carefully chosen width and height in pixels.
Once the sprite is created, it is most efficient to load it into your program
once only using the ImageList method, and this is usually done before the game starts as it may take some time to download. The loaded image may then be used many times for multiple copies of the sprite. The following code is an example loading
a sprite image from an online URL and testing it appears correctly.
We can now create an array with multiple copies of the sprite, using the loaded image, for example.
The sprites all appear on top of each other and we can't do much with them yet.
Sprites are images, but in a game they may have other properties as well such as position, velocity, status and others. We need to store this information for each sprite in arrays as well. There are several ways this could be done, but here is a suggestion
to store all the information for a sprite in an array and have an array of these sprite arrays - a 2D array.
Arrays in Small Basic may be slow, but if we keep the number of elements to a minimum, this method has advantages. It will also improve your programming to keep all associated logical data together and allows for easier sprite creation and deletion.
The code below is structured using subroutines, creating some sprites, positioning them randomly, then moving them about. We could have the sprites rotating or have other features stored in the
'Sprite dimensions we use the half width and height
'get current sprite array
'Reposition sprite center
'Bounce on walls
'Move sprite center
'save updated sprite array (it may have been modified)
The code above may look a bit longer than required, but storing all the data for a sprite in an array and then having arrays of sprites is an efficient way to proceed if we want to create and destroy sprites during the game.
We often want sprites to appear and disappear. One way to do this is to recycle the sprites from a 'pool', activating and using them as required. This can be good for example to fire bullets or missiles, when we only ever need a limited number on screen
at the same time.
The example below fires missiles when the mouse is clicked. A new spriteData
property "Status" is used to flag that missiles are active or not. Inactive missiles are hidden and they are shown while they are active on the screen.
'Sprite finished with
Adding and deleting sprites during a game may be required in some cases, if for example we don't know what the sprite image will be until it is used or the number of sprites cannot easily be handled by a fixed size pool. However, the sprite pool is often
the best approach.
With these points in mind, this is the missile code adding and removing sprites to the missile array as required, for comparison with the 'pool' method.
'current sprite index
While this article is directed towards handling sprite arrays, the methods used in the last example actually include good general techniques to consider as your programming develops. They will transfer well to your next language after Small Basic, where
you will probably encounter classes and collections.