How to wire up a SPI TFT (e.g. ILI9488)?

Projects Networking, Protocols, and Devices
1

Hello,

for quite a while I'm trying to get my first project with a TFT touch screen with SPI (ILI9488) off the ground and I have to admit, I'm pretty confused about the approach.
I'm hoping someone can clear a little bit the fog and I'm sure it's just me, since SPI is a proven technology.

Lets start with the basics;

  • on the pin layout for e.g. the Arduino Nano32, there are pins that are labelled "MISO", "MOSI", "SCK", are they to use them for this particular function or can I define another pin for that, if I wanted to?

  • When defining the settings for the library (TFT_eSPI: #define TFT_DC 2) with the pin number "02", does it mean I should connect it to the pin on the board defined as GPIO-02 or D-2 (figuratively speaken)?

  • what is the difference between a GPIO-nn and a D-nn pin?

If you should now a good tutorial about this subject, pelase let me know.

Any help is much appreciated.
TIA

Arduino-Nano32 pinout
Arduino-Nano32 pinout979×709 61.3 KB

2

Sorry others can probably answer this better than I can, as I don't use too many of the nanos... I have only used a few of them to test other things out.

I believe that D numbers like D2 are the Arduino Digital Pin numbers
That you would do things like: pinMode(2, OUTPUT); or digitalWrite(2, HIGH);

The A numbers like A0 are the Analog pin numbers, that you can use to AnalogRead.

The GPIOnn numbers are the actual physical IO pin of the Actual underlying processor. That is your logical D11 which is your MOSI pin physically on the process is on the
GPIO47 pin. For the most part you may not care. For ones like me, I end up creating
excel documents or the like which breaks down all of the IO pins, by looking up the physical pin within the processors manual, to see all of its capabilities.

You probably need to use these pins, (11, 12, 13) for the MOSI, MISO and SCK. These
are most likely the ones defined in the SPI object.

As for CS and DC pins, you most likely can use any digital pin on the board. With some boards and some libraries, they may prescribe specific pins or a set of pins that can be
used for these functions. Why: Most libraries manually set/clear the DC/CS pins to the
state they need before each output to the SPI. Where there are a few like for the Teensy 3.x boards where there are ways to speed up the SPI if you use hardware CS pins for these two functions), but this is the exception, again most simply allow you to use
any digital pin.

Hope that helps
Kurt

3

If you look under Tools in the IDE you will see an option for pin numbering.

If you leave that option at the default "By Arduino pin" you would use the orange coded numbers and you can use the D or not use the D.

If you use option "By GPIO number" you will use the yellow coded numbers without the GPIO prefix.

I tend to leave this option at "By Arduino pin" and omit the D.

Depending on the graphics library I might define all the pins

#define TFT_CS    2
#define TFT_RST   3
#define TFT_DC    4
#define TFT_MOSI  11
#define TFT_MISO  12
#define TFT_SCK   13

For an insight to the Adafruit GFX library Overview | Adafruit GFX Graphics Library | Adafruit Learning System

4

→ SUMGUY - Thanks for the explanation.

Just to make clear.

If I’’m using “By Arduino pin” option with a Nano32, I can use the pins as defined on the board (TFT_MOSI = “CIPO” = D12), But what if I’m using e.g. an ESP8266/ESP32, still D12?

If I’m “defining” all functions, as in your example “TFT_CS” - “TFT_SCK”, I’m always using the digital pins as defined on the boards “pin layout” ?

So far I haven’t looked into the Adafruit GFX graphic library. I picked the TFT-eSPI instead.

Is the Adafruit library easier to use?

Thanks

5

As already outlined a bit in my post#4, it appears to me that the best way would be to define all my wire connections in my code as (e.g.)

#define TFT_MISO 19 // (→ D19)

#define TFT_MOSI 23 //  (→ D23)

#define TFT_SCLK 18 // (→ D18)

#define TFT_CS    15  // Chip select control pin- (→D18)

#define TFT_DC    2  // Data Command control pin - (→D2)

#define TFT_RST   4  // Reset pin (could connect to RST pin) - (→ D4 or RST)

Conclusion would be, use Dnn pins and not GPIOnn pins.

Am I wright with this conclusion?

Thanks

6

Here is the Adafruit library with an example GitHub - Interested-In-Spresense/ILI9488: ILI9488 library with Adafruit-GFX-Library · GitHub

I don't do that many display projects but I have used TFT_eSPI , I really don't know which would be the better choice.

I like the framebuffer in the Adafruit library but I guess TFT_eSPI has one too.

With ESP32 use the the actual pin number without a prefix.

7

In the meantime I can report some kind of success.

I created a project on WokWi with

  1. Arduino Uno
  2. Arduino_GFX library
  3. TFT ILI9341 driver

I used the test provided by the ILI9341 library (graphicstest.ino)

Defined the following pins

#define TFT_CS 10
#define TFT_DC 9
#define TFT_MOSI 11
#define TFT_MISO 12
#define TFT_CLK 8
//#define TFT_RST

and used the following constructor:

Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, TFT_MOSI, TFT_CLK, TFT_MISO);

And bingo, the sketch was working on Wokwi. What a relieve.

I then took my Uno and my TFT-ILI9341 (240x320) and created the same sketch in the Arduino IDE. And what a disappointment, the sketch doesn’t shows any graphic on the display.

I verified 3times the wiring. and it is correct as defined in the sketch.

The serial output shows that the sketch is running with the timing for each graphical construct, but there is nothing displayed on the screen.

That is what I don’t understand, same libraries, same sketch (code), same wiring – but not the same result.

Is there a possible explanation for that?

TIA

8

Did you connect the LED pin on the ILI9341.

Can you provide the full sketch that you are using.

Also if you didn't adjust your voltage levels watch this video it explains how to get the voltage levels you need for a 3.3v TFT from a 5v Arduino

9

Thank you very much.

Your info is really helpful. I have to admit, LED was not connected.

And the video by Bytes ‘n Bits is awesome. A good learning piece.

I wasn’t aware that the voltage should be 5V and not 3.3V.

Currently I’m trying to digest the proposed wiring from the video.

I’m unclear why he is using 2 resistors in series on each wire. Wouldn’t be the 1st one (2.2KOhm) enough? And what if I’m using a level shifter? Would I still need the 2nd resistor (5.1KOhm)?

You can see, I am a rookie and still have a lot to learn - learning is fun. :slight_smile:

Thanks for your time helping me.

I really appreciate it.

Update: The sketch I’m using is the original example “graphicstest.ino” from the ILI9341 library.

If you still need/want it, let me know and I can post it.

10

The TFT is a 3.3v device so using the UNO , which is 5v, is not safe for the display. If you use an ESP32 or a NanoESP32 which you mentioned earlier in the thread that would be safe

He uses 2 resistors to create a voltage divider, a common method of getting a lower voltage from a higher voltage

Another video to explain https://www.youtube.com/watch?v=TLfnSQdpAnQ

Yes level shifters are a better choice.

The example below demonstrates the use of the Adafruit GFX canvas change the pin numbers if you need to.

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

#define TFT_CS    5
#define TFT_RST   4
#define TFT_DC    2
#define TFT_MOSI  23
#define TFT_SCK   18
#define TFT_MISO  19

#define canvasWidth  16
#define canvasHeight 16
#define size 6
#define xlimit 320 - canvasWidth
#define ylimit 240 - canvasHeight 

int xvelocity=1;
int yvelocity=1;
int x=0;
int y=10;
int speed = 1;

Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, TFT_RST);
GFXcanvas1 canvas(canvasWidth, canvasHeight);

void setup() {
    tft.begin();
    tft.setRotation(3);
    tft.setSPISpeed(40000000);
    tft.fillScreen(ILI9341_BLACK);
    bounceBall();
}


void bounceBall(){
  while(1){
 
  canvas.fillCircle(canvasWidth/2, canvasHeight/2, size, ILI9341_YELLOW);
  tft.drawRect(0, 0, 320, 240,ILI9341_WHITE);
  tft.drawBitmap(x, y, canvas.getBuffer(),canvasWidth,canvasHeight,ILI9341_YELLOW,ILI9341_BLACK);
 
  x += xvelocity;
  if (x == xlimit or x == 0){xvelocity = -xvelocity;}
  y += yvelocity;
  if (y == ylimit or y == 0){yvelocity = -yvelocity;}
  delay(speed);
  }  
}

void loop() {
}