Toggle Nav

Interfacing 1.44-INCH SPI TFT Color Screen Module with ESP32

Table of Contents

1.44-INCH SPI TFT Color Screen Module Features

The TFT display is a kind of liquid crystal LCD that is connected to each pixel using a transistor, and it features low current consumption, high-quality, high-resolution and backlight. This 1.44-inch full color LCD has a narrow PCB display. The resolution is 128×128 pixels, and it has a four-wire SPI interface and a white backlight.

To download the datasheet of this module, click here.

1.44-INCH SPI TFT Color Screen Module Pinout

This module has 8 pins:

  • 3V: Module power supply
  • GND: Ground
  • MOSI: SPI bus write data signal
  • SCK: SPI bus clock signal
  • CS: LCD chip select signal
  • RESET: Reset module
  • DC: Data line/ module command
  • LED: Backlight control

You can see the pinout of this module in the image below.

Required Materials

Hardware Components

ESP32 × 1
1.44 INCH TFT Display Module × 1
Male to Female Jumper Wire × 1

Software Apps

Arduino IDE

Interfacing 1.44-INCH SPI TFT Color Screen Module with ESP32

Step 1: Circuit

The following circuit shows how you should connect ESP32 to this module. Connect wires accordingly.

Step 2: Library

Install the following library on your Arduino IDE.

https://github.com/sumotoy/TFT_ILI9163C

Tip

If you need more help with installing a library on Arduino, read this tutorial: How to Install an Arduino Library

Open the library folder and look for the TFT_ILI9163C file.

Then go to the _settings folder and open the TFT_ILI9163C_settings.h file.

At the beginning of the file, change the settings as shown below.

//DID YOU HAVE A RED PCB, BLACk PCB or WHAT DISPLAY TYPE?
//  ---> SELECT HERE <----
//#define __144_RED_PCB__//128x128
#define __144_BLACK_PCB__//128x128
//#define __22_RED_PCB__//240x320

Step 3: Code

Upload the following code to your ESP32.

/*
  Modify on March 17, 2021
  Modify by MohammedDamirchi base of https://github.com/sumotoy/TFT_ILI9163C
  https://electropeak.com/learn/
*/

#include <SPI.h>
#include <Adafruit_GFX.h>
#include <TFT_ILI9163C.h>


// Color definitions
#define	BLACK   0x0000
#define	BLUE    0x001F
#define	RED     0xF800
#define	GREEN   0x07E0
#define CYAN    0x07FF
#define MAGENTA 0xF81F
#define YELLOW  0xFFE0  
#define WHITE   0xFFFF

/*
Teensy3.x and Arduino's
You are using 4 wire SPI here, so:
 MOSI:  11//Teensy3.x/Arduino UNO (for MEGA/DUE refere to arduino site)
 MISO:  12//Teensy3.x/Arduino UNO (for MEGA/DUE refere to arduino site)
 SCK:   13//Teensy3.x/Arduino UNO (for MEGA/DUE refere to arduino site)
 the rest of pin below:
 */
#define __CS 2
#define __DC 4
/*
Teensy 3.x can use: 2,6,9,10,15,20,21,22,23
Arduino's 8 bit: any
DUE: check arduino site
If you do not use reset, tie it to +3V3
*/


TFT_ILI9163C tft = TFT_ILI9163C(__CS, __DC);

void setup() {
  tft.begin();
}

void loop(){
  testLines(random(0x00ff,0xffff));
  delay(100);
  testText();
  delay(500);
}


unsigned long testText() {
  tft.fillScreen();
  unsigned long start = micros();
  tft.setCursor(0, 0);
  tft.setTextColor(WHITE);  
  tft.setTextSize(1);
  tft.println("Hello World!");
  tft.setTextColor(YELLOW); 
  tft.setTextSize(2);
  tft.println(1234.56);
  tft.setTextColor(RED);    
  tft.setTextSize(3);
  tft.println(0xDEAD, HEX);
  tft.println();
  tft.setTextColor(GREEN);
  tft.setTextSize(4);
  tft.println("Hello");
  return micros() - start;
}

unsigned long testLines(uint16_t color) {
  tft.fillScreen();
  unsigned long start, t;
  int           x1, y1, x2, y2,
  w = tft.width(),
  h = tft.height();
  tft.fillScreen();
  x1 = y1 = 0;
  y2    = h - 1;
  start = micros();
  for(x2=0; x2<w; x2+=6) tft.drawLine(x1, y1, x2, y2, color);
  x2    = w - 1;
  for(y2=0; y2<h; y2+=6) tft.drawLine(x1, y1, x2, y2, color);
  t     = micros() - start; // fillScreen doesn't count against timing
  tft.fillScreen();
  x1    = w - 1;
  y1    = 0;
  y2    = h - 1;
  start = micros();
  for(x2=0; x2<w; x2+=6) tft.drawLine(x1, y1, x2, y2, color);
  x2    = 0;
  for(y2=0; y2<h; y2+=6) tft.drawLine(x1, y1, x2, y2, color);
  t    += micros() - start;
  tft.fillScreen();
  x1    = 0;
  y1    = h - 1;
  y2    = 0;
  start = micros();
  for(x2=0; x2<w; x2+=6) tft.drawLine(x1, y1, x2, y2, color);
  x2    = w - 1;
  for(y2=0; y2<h; y2+=6) tft.drawLine(x1, y1, x2, y2, color);
  t    += micros() - start;
  tft.fillScreen();
  x1    = w - 1;
  y1    = h - 1;
  y2    = 0;
  start = micros();
  for(x2=0; x2<w; x2+=6) tft.drawLine(x1, y1, x2, y2, color);
  x2    = 0;
  for(y2=0; y2<h; y2+=6) tft.drawLine(x1, y1, x2, y2, color);
  return micros() - start;

}

This code is for testing the display and shows various graphical shapes and designs.

Liked What you see?

Get updates and learn from the best

More To Explore

Leave a Reply

Your email address will not be published. Required fields are marked *