Introduction: Simple Graphics on 16*2 LCD Display

By
About: always try to develop your own code, circuit, equation from your own understanding.

Most 16*2 alphanumeric displays provide you with enough RAM to define 6 characters on a pixel by pixel basis.

This project shows you how to create and display simple graphics on the display. A JavaScript file is provided so you can design and preview the images on a browser.

Step 1: The C Code

The code shows you how to load the images into RAM, and how to address RAM to display the image.

const char flower_TL[] = {0x00, 0x03, 0x04, 0x04, 0x03, 0x04, 0x08, 0x08};
const char flower_TM[] = {0x00, 0x11, 0x0A, 0x0E, 0x11, 0x11, 0x11, 0x0E};
const char flower_TR[] = {0x00, 0x18, 0x04, 0x04, 0x18, 0x04, 0x02, 0x02};
const char flower_BL[] = {0x09, 0x06, 0x00, 0x03, 0x01, 0x00, 0x00, 0x00};
const char flower_BM[] = {0x11, 0x0E, 0x04, 0x14, 0x0D, 0x1E, 0x07, 0x04};
const char flower_BR[] = {0x12, 0x0C, 0x00, 0x00, 0x18, 0x10, 0x00, 0x00};
void cmd_lcd(unsigned char c) {
    LATD = c;
    waste_ms(1);
    LATE |= E;
    waste_ms(1);
    LATE &= ~E;
}
void put_icon(const char i) {
    LATE |= RS;
    cmd_lcd(i);
    LATE &= ~RS;
}
void icon_lcd(const char *d) {
    LATE |= RS;
    for(x=0;x<8;++x) {
        cmd_lcd((unsigned char)*d);
        ++d;
    }
    LATE &= ~RS;
}
void load_images(void) {
    //icons
    cmd_lcd(0x40);
    icon_lcd(flower_TL); // 0
    icon_lcd(flower_TM); // 1
    icon_lcd(flower_TR); // 2
    icon_lcd(flower_BL); // 3
    icon_lcd(flower_BM); // 4
    icon_lcd(flower_BR); // 5
}
void init_LCD(void) {
    // commands
    cmd_lcd(0x0c);
    cmd_lcd(0x38);
    load_images();
    cmd_lcd(0x01);
}
void main(void) {
	init_LCD();
    // draw icon
    cmd_lcd(0x8d);
    put_icon(0);
    put_icon(1);
    put_icon(2);
    cmd_lcd(0xcd);
    put_icon(3);
    put_icon(4);
    put_icon(5);
}

Step 2: Generating the Images

If you've ever spent a couple of hours drawing out images on grid-paper and then translating to hex values then you'll really appreciate doing it in JavaScript.

The file is attached as a .txt. There's also a canvas element to generate a preview.

Just name the image and copy the generated hex array into your C code.

Attachments