Introduction

This notebook page introduce the mbed driver for uLCD-24PTU resistive touchscreen display module in the series of Picaso from 4D Systems. The μLCD-24PTU can be used for many applications that require a front end smart graphics interface. The PICASO Graphics processor is embedded inside the display, and is driven by Extensible Virtual Engine (EVE). The μLCD-24PTU have a 2.4” (240x320) LCD Screen, audio amplifier and speaker, micro-SD card connector, Lithium Polymer (LiPo) battery support, along with a group of general purpose input/output pins (GPIO's), including I2C and serial communications. The TFT screen has Integrated 4-Wire Resistive Touch Panel. More on resistive touchscreen.

The communication between the LCD screen and the mbed is established through a 5-pin serial interface (VCC, TX, RX, GND, RESET).

Front and back of μLCD-24PTU display. The data sheet for uLCD-24PTU can be found here.

Example Setup (schematic)

The hookup procedures of uLCD-24PTU is the same as uLCD-144-G2. The following is the pin map for wire up between the screen and mbed. More information can be found at uLCD-144-G2.

Serial Command

Mbed developers can send serial commands to uLCD-24PTU display using our library (link can be found in the demo program section). This C++ library is ported from 4D Systems Serial Command Linux Library which can be found here.

For drawing applications, baud rate affects graphing quality. Higher baud rate enable the display to deliver more information to mbed over unit time, thus improve the quality of the image. The following table shows the relationship between different baud rates and the corresponding percentage of errors.

Demo Program

This simple demo program first draws a red circle in the middle, and then draws a number of equal-radius white circles across the whole screen. The driver library for the display can be found here.

#include "mbed.h"
#include "uLCD_4D_Picaso.h"
#include "Picaso_const4D.h"
/**
* Demo program for uLCD_4D_Picaso resistance touchscreen 
*
*
*
*/

uLCD_4D_Picaso lcd(p28, p27, p30);

int main() {
    lcd.gfx_Circle(120, 160, 50, RED);
    wait(1);
    lcd.setbaudWait(uLCD_4D_Picaso::BAUD_2400);
    lcd.gfx_Circle(100, 100, 40, BLUE);
    lcd.setbaudWait(uLCD_4D_Picaso::BAUD_600000);
    lcd.gfx_Circle(150, 80, 20, GREEN);
    wait(1);    
        
    for (int i = 0; i < 20; ++i) {
        for (int j = 0; j < 30; ++j) {
            lcd.gfx_Circle(10+10*i, 10+10*j, 7, WHITE);
        }
    }
    
    while (1);
    
}

Interactive Touch Screen Demo

Using a set of Touch Screen Commands we can set detection region, read the mode of touch motion, and read the x & y coordinates of a user touch. Developers could add desired functionality using those return values from the commands. The following program demos a simplified touch screen drawing application. The application enables user to graph with single color using any resistive material (finger nail, plastic stick etc.). An eraser button is set to the top-right corner of display. To improve the graphing granularity, developer can modify the baud rate setting using setbaudWait() command. Higher baud rate improves granularity, but at the same time introduce higher probabilities of errors.

The link for the demo program can be found here.

[Repository '/users/admcrae/code/uLCD_4D_24PTU/' not found]

#include "mbed.h"
#include "uLCD_4D_Picaso.h"
 
/**
* Demo program for uLCD_4D_Picaso resistance touchscreen 
* Simple Graphing Application on resistive touchscreen display
* @version 1.0
* @author Andrew McRae, Tianhao Li
*/
// three pins are: TX   RX  RESET
uLCD_4D_Picaso lcd(p28, p27, p30);
//
int main() {
    wait(1);
    // change the baudrate to improve or decrease the latency and plotting quality
    lcd.setbaudWait(Picaso::BAUD_600000);
    lcd.touch_Set(0);
    lcd.txt_Opacity(Picaso::OPAQUE);
    lcd.gfx_RectangleFilled(200, 0, 230, 30, Picaso::WHITE);
    lcd.gfx_RectangleFilled(0, 0, 30, 30, Picaso::WHITE);
    lcd.txt_MoveCursor(1, 1);
    lcd.putCH('E');
    int status = 0;
    int x = 0;
    int y = 0;
    int eraserActive = 0;
    int prevX, prevY;
    while(1) {
        status = lcd.touch_Get(0);
        if (status)
        {
            x = lcd.touch_Get(1);
            y = lcd.touch_Get(2);
            if (status == 1 && x >= 200 && y <= 30) {
                // Clear screen
                // Redraw eraser and clear screen button.
                lcd.gfx_Cls();
                lcd.gfx_RectangleFilled(200, 0, 230, 30, Picaso::WHITE);
                lcd.gfx_RectangleFilled(0, 0, 30, 30, Picaso::WHITE);
                lcd.txt_MoveCursor(0, 0);
                lcd.putCH('E');
            } else if (status == 1 && x <= 40 && y <= 30) {
                  eraserActive = !eraserActive;
            } else {
                if (eraserActive) {
                    lcd.gfx_RectangleFilled(x - 10, y - 10, x + 10, y + 10, Picaso::BLACK);
                } else {
                    if (status == 1) {
                        prevX = x;
                        prevY = y;
                    }
 
                    // Moving, draw a continuous line until release event happen
                    lcd.gfx_Line(prevX, prevY, x, y, Picaso::WHITE);
                }
            }    
 
            prevX = x;
            prevY = y;
   
        }    
    }
}  

Here is a video demo of the graphing application.