Sprite MapMaker
 
By Lars-Håkan Jönsson

One of the most used tools by me except for SineMaker is Sprite MapMaker. Sprite MapMaker is a tool to arrange all your sprites in one picture and supply you with a Visual Basic file to include in your project so that you easy can access your sprites. MapMaker is a old tool that I made in 1998 but I still use the same version.

Way use Sprite MapMaker?
1. Easy to arrange all your sprites in to one picture.

2. If you have only one picture with your graphics then you can open the picture in a image editing program like Paint Shop Pro or Photoshop and convert the picture to for example 256 color and the bonus of this is that all the sprites now have the same color palette and we avoid all color problems if the use runs windows in low color resolution.

3. When you have added all your sprites and saves the project MapMaker produces a VB code module for you to include in your one VB project. This code module includes a function to load all sprite data
in to an array. Now you can access your sprites in a easy way. You have Index, X, Y, Width and Height of all your sprites in the picture.

4. MapMaker saves a MapMaker project file to your picture. This lets you reopen a picture and add more sprites to it. Because a game project often starts with a few sprites and when you have a working game you probably wants to add more sprites.

5. MapMaker also saves a sprite mask picture in black and white. If you don't uses the Blitter Object (Bob) control in the SineMaker package to blit masked sprites (transparent around the sprite). Then you can use the mask picture to manually blit sprites with GDI api calls like BitBlt or VBs PaintPicture.

Important
MapMaker and the Blitter Object control (Bob) uses only Black RGB(0,0,0) as the transparent color. Way only black you say? Well it's for performance reason. It's much easier and faster to transparent blit if the transparent color is black. If you want to have black areas in your sprite then you have to use an almost black color like RGB(1,1,1) or RGB(1,0,0). Nobody will see that it's not true black.    
How to use Sprite MapMaker.
1. Start MapMaker.EXE.

2. Select your sprites. Use the file tree to browse for your sprites. In the preview box you can see the selected sprite. It can be abnormally scaled if the sprite picture is to big for the window but you can see which sprite it is and that's the important thing.

3. Now you are ready to add some sprites. There is a blue dot at the top of the sprite picture. You use this to change the width of the picture (Use mouse and drag). Make the picture at least wider then your widest sprite. Select one or many sprites and then press "Add selected files" to add them to your picture. Now you will be prompted for a Key Name for the sprites. The key name will be included in the VB module file so it's wise to use describing names. If you have a series of sprites that's combines to one animation select all sprites for the animation and press "Add selected files" now all files will have the same key name. Like "Money" in my example picture (see picture above). Then add a space ship sprite and give it a good key name like "Space Ship". This gives you an easy way to find your sprites.

The red dot at the left of the sprite picture is the current insertion point for sprites to be added. You can not drag this one with the mouse, but you can press "New Section" and the insertion point will move down to the lowest point of the highest sprite after the last row.

4. When you have added all the sprites it's time to save it all. Press "Save As..." on the "File" menu to save the sprite project. You will be asked for a file name for the picture. We save it as "GameSprites.bmp". Next MapMaker will ask you for a Module name and suggest "GameSprite.bas", and finally MapMaker will ask you for a project filename and suggest "GameSprite.mmp".

The following files have now been saved:
    1. GameSprite.bmp  (This is your picture with all the sprites.)
   

    2. GameSprite_Mask.bmp. (This is a inverted black and white picture with all the sprites. If you use the Bob control in the SineMaker package you don't need this.)
   

    3. GameSprite.Bas  (This is a VB module with code to access your sprites.)

    4. GameSprite.mmp  (This is the MapMaker project file. Use this if you want to open a MapMaker project and add new sprites.)

 5. Press "Open..." in the file menu to load a previously saved project.
 
Use it in Visual Basic
1. Start a new project in Visual Basic.

2. Set the forms ScaleMode=3 (Pixel).

2. Add a Bob control (SineMaker Blitter Object) and set the Width=320 and Height=240.

3. Add a PictureBox. Set the following picture box properties:
    1. AutoRedraw=True  (This will preserve the picture in memory even if we make the picturebox "Visible=False")
    2. AutoSize=True  (Resize to oure sprite picture)
    3. BorderStyle=1  (Fixed single)
    4. Picture=Load your sprite picture. (GameSprite.bmp)
    5. ScaleMode = 3 (Pixel.  All data in the module file generated by MapMaker is in pixels and the Bob control handles everyting in pixels.)
    6. Visible=False (Hide the picture box.)

4. Add a command button to the form.

5. Add a timer to the form and set the interval property to 50 (Interval=50).

6. Copy the module file (GameSprite.bas) to your project map and add the file in to this Visual Basic project.

7. Now we are ready to write some code. Okey! Add the following code to the Form_Load event:

Private Sub Form_Load()
    LoadSpriteData
    Bob1.CreateMask Picture1.Picture
End Sub

(LoadSpriteData is a method in the "GameSprite.bas" module to load all sprite data in to the SpriteData array)

8. Add the following code to the General Declaration section of the form.

Dim bDrawSpaceShip As Boolean

8. Add the following code to Command1_Click event (Button control):

Private Sub Command1_Click()
    bDrawSpaceShip = True
End Sub

9. Add the following code to Timer1_Timer event (Timer control):

Private Sub Timer1_Timer()
    Static lSprite As Long
    Dim lSpaceShip As Long

    '**** Money ****
    Bob1.TBlt 10, 10, SpriteData(lSprite).Width, SpriteData(lSprite).Height, Picture1.hDC, SpriteData(lSprite).X, SpriteData(lSprite).Y

    lSprite = lSprite + 1
    If lSprite > 14 Then lSprite = 0

    '**** SpaceShip ****
    If bDrawSpaceShip = True Then
        lSpaceShip = 17
        Bob1.TBlt 60, 10, SpriteData(lSpaceShip).Width, SpriteData(lSpaceShip).Height, Picture1.hDC, SpriteData(lSpaceShip).X, SpriteData(lSpaceShip).Y
    End If

    '**** Update screen ****
    Bob1.Flip
End Sub

Download MapMaker and the VB sample and check it out. 

Require VB6-Runtime (msvbvm60.dll and comdlg32.ocx) all included in the SineMaker setup if you don't have VB6 installed.
Download MapMaker: MapMaker.Zip (File size: 24 KB)
Download tutorial sample code: MapMakerTut.Zip (File size: 41 KB)
 

 

Copyright © 2002 Lars-Håkan Jönsson