Introduction: How to Use a Nokia Color LCD!

About: I finally graduated from Missouri University of Science and Technology (Missouri S&T, formerly University of Missouri Rolla) with a computer engineering degree. Originally from Belleville, IL (St. Louis area)…

Nokia manufactures a wide variety of cell phones and many of their cheaper phones contain simple LCD's which may be used in microcontroller projects.  There is one particular LCD model that is used in a wide variety of their phones and is often referred to as simply a "Nokia LCD", or "Nokia 6100 LCD".  I used to use a Nokia 2600 phone and whenever I upgraded I took the Nokia apart to remove its LCD.  This LCD appears to be the same one that is sold as "Nokia 6100 LCD" and I was able to get it up and running with a bit of work using an AVR.

SparkFun sells them if you do not already have one,
http://www.sparkfun.com/products/569

You will need some sort of breakout board in order to connect the display.  Sparkfun sells several (a standard breakout, an Arduino shield, an Olimex module, etc) as well as the bare surface-mount connector.  Since all of SparkFun's boards include the LCD, I just bought the connector and made my own breakout board since I already had the LCD.

The connector:
http://www.sparkfun.com/products/570

Step 1: LCD Connector and Breakout Board

If you don't have a breakout board, you need to first make some sort of connector for the LCD.  My first attempt was to solder thin magnet wire to each leg of the connector with a fine-tip soldering iron.  This took several tries but eventually I got it connected.  I then applied generous amounts of super glue to make sure it wouldn't come apart and soldered on some thicker wires to connect to the microcontroller.

For cleaner and more practical uses, I eventually made a small breakout board for the connector that can be printed and etched using the laser printer toner transfer method.  Make sure not to put too much pressure on the transfer or the traces can be pressed together.  If this happens, you can try cutting the toner away with a sharp knife, but you'll probably end up breaking the toner trace and have to start over.

I hand-soldered the connector to the finished PCB and then added some breakaway pin headers so that the board may be breadboarded or socketed into projects while being easily removable.

Step 2: Electrical Interfacing

After you have a breakout board for the LCD connector, you must connect it to your circuit.  There are 10 pins on the connector, one is unused.  The LCD has four control signals (Clock, Data, Reset, Chip Select), two 3.3V inputs, two grounds, and a backlight input.  The LCD driver circuitry runs on 3.3V as do the control signals.  However, the backlight requires a higher voltage around 7V.  Using a 1K ohm resistor between the backlight power and a 12V power supply seems to work well, the voltage is around 6-6.5V which makes it bright enough to use.

Pinout:
1:  Vcc (3.3V)
2:  Reset
3:  Data
4:  Clock
5:  Chip Select
6:  Vcc (3.3V)
7:  Unused (Not Connected)
8:  Ground
9:  Ground (Backlight LED -)
10:  Backlight LED +

Since the LCD protocol is 9-bit SPI, you cannot use the hardware SPI interface found on many microcontrollers (including the AVR series microcontrollers) as they often only support 8-bit mode.  This means that you will probably have to implement a software SPI output.  Electrically, this means you can connect the four control lines to any unused I/O pins on your microcontroller.  Your microcontroller must be running at 3.3V to connect the lines directly, otherwise add 10K ohm resistors on each line to limit the current going into the LCD.

Step 3: LCD Protocol - Initialization (Phillips PCF8833 Only!)

The LCD has many functions that are available by sending commands over the SPI interface.  The important ones are explained here and will allow you to get your LCD up and running.  A full set of commands is listed in the PCF8833 datasheet here:

http://www.nxp.com/acrobat_download2/datasheets/PCF8833_1.pdf

The 9th bit is the command flag.  If set to 0, the data byte is interpreted as a command.  If 1, the data byte is interpreted as data.  Data may be sent after issuing an appropriate command.

Before you can write to the LCD, it must be initialized.  First, the Reset line must be pulled low for around 100ms and then raised high again.  The Reset line must remain high during operation.  Then, a sequence of commands must be sent, in the following order:

SLEEPOUT (Hex 0x11) - Exits LCD sleep mode

BSTRON (Hex 0x03) - Turns on booster voltage

COLMOD (Hex 0x3A) - Sets pixel format to the following data byte
Data 0x03 - The pixel format 0x03 is 12 bits per pixel

MADCTL (Hex 0x36) - Sets several LCD params - [<Mirror Y>, <Mirror X>, <Vertical Write>, <Bottom to Top>, <BGR/RGB>, -, -, -]
Data 0xC0 - Flips display upside down (my LCD was mounted upside down), uses RGB color format

SETCON (Hex 0x25) - Set Contrast to following data byte
Data 0x40 - This contrast value works fairly well for my LCD, adjust if yours does not display well

DISPON (Hex 0x29) - Turns on display

Step 4: LCD Protocol - Drawing (Phillips PCF8833 Only!)

Continuing with the protocol, once the LCD is initialized it is ready to draw.  Drawing works by first defining a region to draw and then streaming pixel data to fill that region.  It is confusing at first, but if done properly is more efficient than pixel-by-pixel drawing.  A region is simply a rectangular area on the screen.  We'll say it begins at point (X1,Y1) and ends at point (X2, Y2).  Once defined, the LCD controller will fill in pixels from left to right starting at (X1, Y1).  When it reaches the edge of the region, it will jump to the next line [in my example, (X1, Y1+1) ].  It does this until it reaches (X2, Y2) at which it stops accepting data.  If you only want to draw one pixel, you simply set (X1, Y1) and (X2, Y2) to the pixel you want to draw.  This defines the region as a single pixel.  Any data sent after the first pixel's worth of data is discarded.

To define a region, you must send these commands in the following order:

PASET (Hex 0x2B) - Page Address Set
Data Y1 - The starting Y position
Data Y2 - The ending Y position

CASET (Hex 0x2A) - Column Address Set
Data X1 - The starting X position
Data X2 - The ending X position

RAMWR (Hex 0x2C) - RAM Write - Start sending pixel data after this command

<Pixel Data> - Formatting described below

After the screen is ready to accept pixel data, you must send color data for each pixel in order.  In the default color mode (0x03, 12 bits per pixel) color data uses 12 bits.  This means that you can send 2 pixels worth of data for every 3 bytes.  If you are only sending one pixel, you only need to send 2 bytes.  The 2-pixels-per-3-bytes format is shown below:

RRRR GGGG | BBBB RRRR | GGGG BBBB

If only sending one pixel, you may use this format instead:

XXXX RRRR | GGGG BBBB (X means "don't care", can be either 0 or 1, these bits are discarded)

In C, you may use this code to output 2-pixels-per-3-bytes format, color1 and color2 are 16-bit values (ints in AVR GCC)

(color_lcd_send_data(char dat) is a function that outputs a data byte to the LCD)

color_lcd_send_data(color1 >> 4);
color_lcd_send_data(((color1&0x0F)<<4)|(color2>>8));
color_lcd_send_data(color2);

This code is simplified for 1-pixel-2-bytes format for single-pixel writes:

color_lcd_send_data(color >> 4);
color_lcd_send_data(color<<4);

Step 5: AVR - Outputting 9-bit SPI With Inline Assembly

To implement the 9-bit protocol using an AVR, I found a nice ASM function in the SparkFun example code.  I modified the code some to clean it up and adapt it for the Phillips controller.  This ASM code is more efficient than using regular C and allows faster LCD writes.

It uses ATMega168 pins 11, 12, 13, and 14.
11 - Data
12 - Clock
13 - Chip Select
14 - Reset (not covered by this function)

void soft_spi_send_byte(char cmd, char data)
{
     // enable chip_sel
    asm("cbi %0, 7" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send the command flag bit
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 0" : : "a" (cmd));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send Bit 7 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 7" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send Bit 6 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 6" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 5 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 5" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 4 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 4" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 3 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 3" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 2 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 2" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 1 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 1" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // Send bit 0 of data
    asm("cbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("cbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbrc %0, 0" : : "a" (data));
    asm("sbi %0, 5" : : "I" (_SFR_IO_ADDR(PORTD)));
    asm("sbi %0, 6" : : "I" (_SFR_IO_ADDR(PORTD)));

    // disable chip_sel
    asm("sbi %0, 7" : : "I" (_SFR_IO_ADDR(PORTD)));
}

The following defines are used to make sending data and commands easier:

#define color_lcd_send_cmd(cmd)    soft_spi_send_byte(0, cmd)
#define color_lcd_send_data(data)    soft_spi_send_byte(1, data)

Step 6: Drawing Rectangles

Rectangles are incredibly useful.  You can draw one big rectangle to clear the screen, use them for menu elements, indicators, check boxes, frames, text backgrounds, and much more.  Thankfully they are easy to draw on the Nokia LCD's.  All you need to do is define a region the size of the rectangle and fill it in with a solid color.  The following AVR C code (using the functions described in the last section) will do this.

void color_lcd_draw_rectangle(int color, unsigned char xs, unsigned char ys, unsigned char xe, unsigned char ye)
{
    color_lcd_send_cmd(PASET);
    color_lcd_send_data(ys);
    color_lcd_send_data(ye);

    color_lcd_send_cmd(CASET);
    color_lcd_send_data(xs);
    color_lcd_send_data(xe);

    color_lcd_send_cmd(RAMWR);

    unsigned int half_rect_area = (((unsigned int)(xe-xs+1)*(ye-ys+1))/2);

    for(unsigned int i = 0; i < half_rect_area; i++)
    {
        color_lcd_send_data(color>>4);
        color_lcd_send_data(((color&0x0F)<<4)|(color>>8));
        color_lcd_send_data(color);
    }
}

It starts out by defining the region using CASET and PASET, initiates a RAM write, and then fills the region with a solid color.  Since the three send_data lines actually fill 2 pixels instead of 1, the for loop only has to count to half the rectangle area.

Step 7: Text!

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 8: Menus

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.

Step 9: Drawing Optimizations

When drawing moving objects on the LCD, you can greatly speed up the frame rate and eliminate screen glitches by only redrawing the moving parts of an object rather than redrawing the entire screen or entire object.  For instance, if a ball is moving across the screen, rather than redrawing the entire ball you can just draw the pixels along the edge that has moved and clear the pixels on the edge that has moved away.  Techniques such as frame buffering and double buffering can be used, where a new frame buffer is compared against an old frame buffer and only differing pixels are written to the display.  However, given the limitations of AVR and similar 8-bit microcontrollers, these techniques are probably out of range.  If you are using an ARM or other 32-bit microcontroller with a higher performance CPU, more RAM, etc. then you can take advantage of double buffering for a much more efficient screen drawing system.

Step 10: Drawing Pictures Using the Serial Port

It is actually very easy to draw full color photos on the LCD!  I simply used the serial port to transfer the image from the PC to the AVR which displays it on the LCD.  To convert the image into the correct format, I wrote a small application in Visual Basic (VS 2010) that takes a 130x130 .bmp formatted image and transforms it into the 12 bit per pixel color format needed to display on the LCD.  The Visual Basic VS2010 project is included with the code package at the end of this Instructable.

The serial port uses 115200 baud which is very fast for a microcontroller.  This enables a quick transfer of image data to the microcontroller and it can draw a full 130x130 image in less than 1 second.  To do this, the microcontroller must be running at around 20MHz (it must be exactly 20MHz to use the code unmodified, but it may work at 16MHz if the baud rate calculation is changed).  A MAX232 level shifter is used to convert the RS-232 signal into a 0-5V TTL signal.  Although the ATMega168 is only running at 3.3V, the inputs are 5V tolerant so you may connect the 5V signal to the Rx pin and it will still work.

Step 11: The Code - for AVR Studio 4 (AVR), Keil UVision 4 (8051)

I have posted example code for both AVR and 8051 microcontrollers as I have used the LCD with both.  The code was originally written for ATMega168 based on the SparkFun examples for both the LCD and Arduino LCD Shield.  I added text and menus then ported it to 8051 for use on my 8051 project board.  I then revised many systems which have been backported into the AVR code.