Commodore VIC-20 graphics tutorial
I confess that I've always had a fear of programming graphics on the VIC20. I used to have a working knowledge of the procedural BASIC programming. It was the details on the VIC20 memory mapping that always escaped my ability. For some reason, people kept the dark arts of graphics programming a secret. They would use confusing addresses and tricky sequencing to befuddle the neophyte. Not any more. It is easy.
There are only 4 basic steps that you need to know to create your own graphical images. It's best to start simple and then create your own impressions. Possible the most difficult aspect of this style of programming is the use of the POKE command. Don't panic. POKE means insert number into this memory address.
- Screen location - there are 506 addresses pointing to locations on grid pattern. The top left address is location 7680. Add 1 to this address to continue going across the tops of the screen, down the lines to the bottom right. The bottom right position is at 8186.
- Display symbol - there are two sets of character sets. Only 1 set of 128 display characters can be displayed on screen. The graphics related characters are located in the second half of this list, from character codes 64 to 127. Some examples of graphics characters (character code in brackets) ♠ (65), ♥ (83), ♣ (88), and ♦ (90). Character code 32 is the blank space character that can be used to erase existing characters at that screen locstion.
- Color location - there is also a address location for setting colours that matches the screen location. It is easy to work out the color location for each screen location. The screen color location is always the screen location number added to the number 30720.
- Select color - there are 8 colours available on the VIC-20 color map. I have detailed the abbreviated list of VIC-20 color codes in the table below.
- Poke command - displaying a symbol one the screen requires a simple POKE command of the symbol number to the display location. A second POKE is used to post the color code to the display location, offset by adding 30720.
Commodore VIC-20
Color Codes
- ██ 0 black
- ██ 1 white
- ██ 2 red
- ██ 3 cyan
- ██ 4 purple
- ██ 5 green
- ██ 6 blue
- ██ 7 yellow
Commodore VIC-20 graphics examples
Command | Description |
---|---|
10 POKE7680,65:POKE(7680+30720,0) RUN |
Prints a ♠ in █ color at the top left corner of the screen |
10 POKE7701,83:POKE(7701+30720,2) RUN |
Prints a ♥ in █ color at the top right corner of the screen |
10 POKE7910,90:POKE(7910+30720,2) 20 POKE7911,90:POKE(7911+30720,4) 30 POKE7932,90:POKE(7932+30720,5) 40 POKE7933,90:POKE(7933+30720,6) RUN |
Prints two rows of two ♦ in four different colors in the middle of the screen |
Commodore VIC-20 character display locations
