Let's create an MPAGD game - Part 21: Changing fonts, COLOUR, PAPER, INK and CLUT
In our last lesson, we looked at working with the player SCORE, BONUS and DISPLAYing it on the screen, also using AT and PRINT to also display additional text and info.
But visually it looks a bit dull.
Fortunately, MPAGD has a font editor and some banks of fonts for us to choose from. So, let's take a look, in the Editor Menu, select Font:
So, there are three parts to this screen.
In the top left we have a character editor, this works a bit like the block editor, it's an 8x8 grid and we can click the cells in the grid to edit the character. Note that this editor doesn't have a colour selector, we handle colour for font characters differently which we will come onto later.
In the top right we have the current font bank, if we click on any of the characters in the bank, they will appear in the character editor...making them editable
At the bottom there are 12 sets of pre-styled fonts, if you click on one of these they will then become the font that our game will use.
So, we have an option here, we can use the default, edit the default and create our own, or install one of the ready made one's.
Now, personally I tend to create my own fonts for my games, but I quite like the 3rd one down in the middle column of ready made ones, so I'm going to use that one as a starting point. All I need to do is click it to install it... I'll get a warning message asking if I want to overwrite the existing font, yes please!:
Let's build the game again:
The first thing we see is the INTRO MENU, and yes, it's now using the font we installed. But the black text on grey is a bit boring. So let's change it, from the Events menu select Intro Menu, I'm not going to explain exactly how this works just yet, we'll come back to it later, for now though, let's just change the colours by adding in a three lines of code at the top:
EVENT INTROMENU BORDER 0 PAPER 0 INK 5 LET CONTROL = 99 WHILE CONTROL >= 99 CLS AT 8 10 PRINT "1. KEYBOARD" AT 10 10 PRINT "2. KEMPSTON" AT 12 10 PRINT "3. SINCLAIR" AT 14 10 PRINT "4. REDEFINE" LET CONTROL = 99 WHILE CONTROL = 99 IF KEY OPTION1 LET CONTROL = 0 ENDIF IF KEY OPTION2 LET CONTROL = 1 ENDIF IF KEY OPTION3 LET CONTROL = 2 ENDIF IF KEY OPTION4 CLS AT 3 9 PRINT "PRESS KEY FOR:" AT 6 12 WHILE KEY OPTION4 ENDWHILE PRINT "PAUSE" DEFINEKEY FIRE3 LET CONTROL = 100 ENDIF ENDWHILE ENDWHILE CLS
Run the game and let's see the change:
Now we have a black border, black screen and dark cyan text. We defined these by including a number after each command, but how do we know what number is which colour?
from the Editor menu select Palette:
This will display the available colours (I'm using standard ZX Spectrum so this is what I will see: (I've badly drawn the numbers on!)
The top row shows the dull colours 0-7
We then get the bright versions on the second row.
So, why cant we just add a number for the BIRGHT CYAN INK into our INK command.
Well, the problem is, the speccy only really has 8 colours, but it also has an attribute for BRIGHT - but it can only display BRIGHT INK on BRIGHT PAPER
So if we want to have BRIGHT CYAN on black we are going to need to switch the Colour Look Up Table to the BRIGHT one, we do this by adding the CLUT command
CLUT, on the Spectrum, has 4 possible values:
CLUT 0 ; the default, dull colours
CLUT 1 ; bright colours
CLUT 2 ; dull flashing colours
CLUT 3 ; bright flashing colours
Lets switch to CLUT 1 by editing the top of our Intro Menu event:
BORDER 0 CLUT 1 PAPER 0 INK 5
Run the game, and now we have bright text.
But that's taken three lines of code to set the 'permanent display attributes' and MPAGD gives us a shorthand way of doing all three in one, by using the COLOUR command.
COLOUR accepts a single 8bit (0-255) value to set ink, paper bright on/off and flash on and off all in one hit. Here's an example of the available values:
(note that values 123 onward are the flashing versions!)
So, from the table above I can see that value 69 is bright cyan ink on black paper, and not flashing.
So I can change the code at the top of my Intro Menu event to:
BORDER 0 COLOUR 69
Run the game and it should look exactly the same.
Personally, I tend to use COLOUR when I want to change any text colours in my game.
Note that I still need to set the BORDER colour separately, COLOUR does not change the border, but that's fine, I'll just include it in the Intro menu event.
Whatever colours you choose will remain in place until your code tells the game to do otherwise. So, now our score bar at the top of the screen is also cyan text on black.
We can, of course, change this by carefully adding COLOUR (or PAPER & INK) commands wherever we need them. Let's add some to our RESTART SCREEN event which first draws our score bar:
EVENT RESTARTSCREEN RESTORE READ B ; read the first value of the DATA and put it in B IF SCREEN >= 1 ; if it is screen 1 or above REPEAT SCREEN ; then repeat SCREEN-many times READ B ; read the next value ENDREPEAT ; so we've found the right B value for the Screen ENDIF AT 0 0 COLOUR 4 ; dull green text on black PRINT "SCORE:" COLOUR 71 ; bright white text on black AT 0 6 SHOWSCORE AT 0 21 COLOUR 6 ; dull yellow on black PRINT "LIVES:" COLOUR 66 ; bright red on black DISPLAY DOUBLEDIGITS LIVES ;-------------------number of Bones per screen------------------------- DATA 5 7 3 4 6 9 5 8 5 6 4 8 6 9 3 8 9 DATA 4 7 8 10
That should brighten the game up a bit..., let's give it a test:
OK, it starts as expected, but as soon as I collect a bone, the score value turns red.
This is because the last COLOUR command we used is COLOUR 66 - red on black, and we have a SHOWSCORE command also in our COLLECT BLOCK event - so, we'll need to update that with our preferred colour for displaying the score, i.e. COLOUR 71 ; bright white on black:
EVENT COLLECTBLOCK SCORE 100 ; score 100 points when we collect a Bone AT 0 6 COLOUR 71 ; bright white on black SHOWSCORE ; display the score ;...
and, as we also update the LIVES when a player is killed, we'll need to add the right COLOUR there too, so that the number of lives are always bright red on black. So let's edit the KILL PLAYER event:
EVENT KILLPLAYER SUBTRACT 1 FROM LIVES ; reduce the number of lives by one COLOUR 66 ; bright red on black AT 0 27 ; line 0 column 27 DISPLAY DOUBLEDIGITS LIVES ; display lives in xx format ZEROBONUS ; remove any accrued fart bonus
...build and run the game...
Well that all seems to be working OK...
The Intro Menu screen is a bit boring though, we could at least add the title of our game to it, we'll look at this next.