Skip to content
BearThorne edited this page Oct 22, 2017 · 15 revisions

Understanding the game logic is only half the story...the other half (and arguably the more important one) is the graphics.
After all, if the player can't see what's going on...what good is the game?!

So let's take a look at using the map and sprite editors, as well as the map() and spr() functions...

SPRITE EDITOR

sprites

The Sprite editor is extremely simple. Just click on a slot and start drawing your sprite.
Be sure to try out all the different tools below the drawing area.
I suppose I could go into more detail than that...but it seems kinda pointless.

Take note of the Sprite ID# at the top:
sprite_id

This is the number that refers to that exact slot you drew your sprite in.
We'll be using it to tell the spr() function what sprite to use where.

MAP EDITOR

map

The map editor is nearly as simple as the sprite editor...just use the Sprite Pull-Down Menu to pick a sprite...
sprite_palette

and start drawing your map...
map_editing

Here's the sprite sheet for this tutorial:
watchtower_sprites

just download it, then open TIC-80 and type:

>import sprites  

Navigate to the watchtower_sprites and select it.
TIC-80 will load it into the sprite editor of the cart you have up.

MAP() FUNCTION

So at this point you should have a sprite sheet drawn, and a map built.

NOTE
if your map is larger than the screen area, you'll need to use a "camera" to follow your character.
Have a look at either of these tutorials to learn how to set that up:
Camera Tutorial by Trelemar
Grid-Based Camera Movement By me :)

In order to draw your map onscreen we'll need to call the map() function in your script:

map(start_x,start_y,width,height)

There are more arguments available in the map function. For an overview of using them, look here

The start_x and Start_y is looking for the map cell coordinate to start drawing from.
In this case I drew my map starting at the first cell (0,0) so that's:

map(0,0,width,height)

Now for the width and height...
TIC-80's screen can display a maximum of 30x17 map cells onscreen.
Since the map is intended to take up the whole screen we'll use 30 and 17:

map(0,0,30,17)

now the largest visible map area is being draw to the screen.

Clone this wiki locally