This and many other tutorials are available at:
[url]www.dbheaven.com[/url]
A sprite is basically is a two-dimensional "object" that you can display on screen and interact with. It's important to make a distinction between sprites and images. Sprites are actually things. In order to give them a sprite an appearance, though, we have to assign an image to it. So a sprite, whenever it is displayed on screen, looks like a specific image, but it exists independently of that image (we can change the image, and it's still the same sprite).
This is important, of course, because DarkBASIC has commands for images, and commands for sprites, and we'd do well not to get them confused.
Let's begin with images. If you have version 1.09 or above, you can use jpg or bmp files to load images from. 1.08 and below supports only bmp. I'll be using a bmp file in this tutorial, to make sure that everyone can follow along.
First, you have to make sure that your image file is in the working directory (or within a folder in that directory). To ensure this, click on File | New Project in DarkBASIC to create a new folder and dba file. In Windows, move your images into that folder. Pretty much any bmp file will do for this tutorial, but here's one for you for convenience:
(see dbheaven.com)
To get this file as a usable DarkBASIC image, we write:
LOAD IMAGE "sample.bmp", 1
Images in DarkBASIC are numbered. That's what the "1" is. From now on, whenever we want to use this image, we call it by its image number. We could have just as easily called it "32" or "995". But we start with 1 just for simplicity.
This command will place the image on the screen:
PASTE IMAGE 1, 100, 100
As you can see, we are referring to the image now by its image number, instead of by the filename from which it was taken. Now that we know a bit about images, let's move on to sprites. Sprites are placed on screen with the SPRITE command, like so:
SPRITE 5, 200, 200, 1
The first number is the sprite number. The next pair of numbers are the screen coordinates, and the final number is the image number. Our sprite will look like image number 1. The reason that I used "5" for the sprite number is insignificant. It could have been 1 or 32 or 995 or whatever. I wanted to avoid "1" just for the sake of this tutorial, though, because I don't want to give the impression that the sprite number has to be the same as the image number. It doesn't. Every sprite in your game will have a unique sprite number, and every image will have a unique image number. But one sprite might have the same "sprite number" as an image's "image number". They are unrelated.
Let's take a look at the real difference between sprites and images. Let's run this code in our working directory:
LOAD IMAGE "sample.bmp", 1
PASTE IMAGE 1, 100, 100
PASTE IMAGE 1, 100, 150
PASTE IMAGE 1, 100, 200
SPRITE 5, 300, 100, 1
SPRITE 5, 300, 150, 1
SPRITE 5, 300, 200, 1
What are the results on the screen? The three PASTE IMAGE commands put three copies of image #1 on screen. But the three SPRITE commands only seem to put one sprite on screen. Why?
Because Sprite #5 is one single object. The first time we call the SPRITE command, it puts sprite #5 at location (300, 100), and makes it look like image 1. The second SPRITE command puts sprite #5 at location (300,150). Once sprite cannot be in two places at the same time. It disappears from the previous location, and appears at the new location. The third SPRITE command does the same thing -- the sprite can only be in one place at a time because it is a thing. Images, on the other hand, can lay copies of themselves all over the place.
What is the advantage of this? It means that, in your program, you can simply use the SPRITE command to continually reposition your 2-dimensional objects, and they will appear to move. You don't have to worry about erasing previous copies. There are other advantages as well. We'll see one of them in a second. Go back to the program and get rid of those three SPRITE commands. Replace them with this:
SPRITE 5, MOUSEX(), MOUSEY(), 1
As you know, MOUSEX() and MOUSEY() will return the mouse coordinates. So now we will be positioning the sprite where the mouse is. Put that command inside of a DO loop to get the following program:
LOAD IMAGE "sample.bmp", 1
PASTE IMAGE 1, 100, 100
PASTE IMAGE 1, 100, 150
PASTE IMAGE 1, 100, 200
DO
SPRITE 5, MOUSEX(), MOUSEY(), 1
LOOP
You can add HIDE MOUSE at the beginning to get rid of the ugly mousepointer if you like. (Actually, this is a great way to change DarkBASIC's pointer for something you prefer.) Move the mouse around, and the sprite moves around. Try replacing that SPRITE COMMAND with:
PASTE IMAGE 1, MOUSEX(), MOUSEY()
You get a whole bunch of copies of the image like a trail behind the mouse. You get none of that with sprites. Even better, you can drag your sprite overtop of the other images on screen, and they are left unaffected after you move off of them -- sprites preserver the background that they cover up. Later on, we'll see how you can use some of DarkBASIC's other sprite-related commands to detect collisions, and lots more.
