Step 7Text!

Although this is a graphical LCD, it is still useful to be able to print text to it.  Unlike character-based LCD's, graphical LCD's do not contain a character map or font table or anything.  To print text to a graphical LCD, you must define your own font table in your code and then print it character-by-character using the table.  In my code, I have provided a font table (one that I converted by hand because I couldn't find a good program to do it for me).  The font is 6x8 which should allow you to fit plenty of text on the screen.  I have provided functions for printing characters as well as strings.

Each byte of the font table represents one vertical column of the font.  The MSB is the bottom pixel while the LSB is the top pixel.  Since each character is 6 pixels wide, a 6-byte offset is used to find characters in the array.  The array begins at decimal value 32 which represents the first printed ASCII value (space) and continues until decimal value 126 (~) which is the last printed ASCII value.

The code for this one is relatively long with the font table, so I'm not going to paste it here.  The complete code is available for download at the end of this Instructable.

Step 8Menus

With rectangles and text down, we can begin making truly useful stuff.  Menus allow users to select from a large number of options with only a few buttons (Up, Down, and Select are common).  To make a menu that looks good, you need to format your screen and text properly.  I wanted a single title line and the rest to be menu entries.  The LCD is 130x130 (usable) pixels in resolution.  This means that I have 130 vertical pixels to divide up into menu lines.  Since my font is 8 pixels tall, I decided that using 10-pixel-tall menu lines would be good.  This gives a 1 pixel border around the text on top and bottom, 13 total menu lines (1 title + 12 entries), and up to 21 characters per menu line.

To make the menu system more portable, I built its functionality into a single function which takes a handful of arguments.  This function will draw the menu and allow the user to select an option.  The function returns the index of the selected option.  To make the code reusable, all menu text is loaded from an array.

This is the function prototype:
char print_menu(char menu_text[][22], char menu_length, char starting_position, int title_color, int title_bgcolor, int entry_color, int entry_bgcolor, int highlight_color, int highlight_bgcolor);

menu_text - an X-by-22 character array.  Each row is one menu line (the first line is the title).

menu_length - The number of lines in the array, not including the title line

starting_position - The index of the entry to start on (the first index is 1 as the title line is technically index 0 but cannot be selected)

title_color - The title text color
title_bgcolor - The title background color

entry_color - The entry text color
entry_bgcolor - The entry background color

highlight_color - The highlighted entry text color
highlight_bgcolor - The highlighted entry background color

Note:  All colors are 16-bit values in 0x0RGB format

The actual code is not posted because it is long, it is included for download at the end of this Instructable.