{"id":13194,"date":"2017-02-07T21:50:43","date_gmt":"2017-02-08T02:50:43","guid":{"rendered":"http:\/\/embedded-lab.com\/blog\/?p=13194"},"modified":"2023-04-11T22:16:42","modified_gmt":"2023-04-12T02:16:42","slug":"tutorial-7-esp8266-ili9341-tft-lcd","status":"publish","type":"post","link":"https:\/\/embedded-lab.com\/blog\/tutorial-7-esp8266-ili9341-tft-lcd\/","title":{"rendered":"Tutorial 7: ESP8266 and ILI9341 TFT LCD"},"content":{"rendered":"

In tutorial 3<\/a><\/strong>, we discussed how to use an SSD1306-driven I2C OLED screen with EasyESP-1 for displaying basic text and graphics. We used\u00a0a 0.96″ (along the diagonal) 128\u00d764 monochrome pixels OLED display for illustration. Despite its small size, the readability was pretty good due to its high contrast, which makes it a very good, compact size display for general applications. The excitement of having a display screen in an ESP8266 project can be further enhanced by upgrading the choice of display to colorful TFT LCD. One such screen that is readily available in the market at affordable price is ILI9341 based TFT LCDs. This tutorial describes the method to connect\u00a0such displays with ESP8266 using Arduino IDE.<\/p>\n

\"Interfacing<\/a>

Interfacing an ILI9341 TFT LCD<\/p><\/div>\n

Hardware<\/h4>\n

The datasheet of ILI9341 driver chip states:<\/p>\n

ILI9341 is a 262,144-color single-chip SOC driver for a-TFT liquid crystal display with resolution of 240RGBx320 dots, comprising a 720-channel source driver, a 320-channel gate driver, 172,800 bytes GRAM for graphic display data of 240RGBx320 dots, and power supply circuit. ILI9341 supports parallel 8-\/9-\/16-\/18-bit data bus MCU interface, 6-\/16-\/18-bit data bus RGB interface and 3-\/4-line serial peripheral interface (SPI). The moving picture area can be specified in internal GRAM by window address function. The specified window area can be updated selectively, so that moving picture can be displayed simultaneously independent of still picture area.<\/p><\/blockquote>\n

You can find ILI9341-based TFT displays in various sizes on eBay and\u00a0Aliexpress. The one I chose for this tutorial is 2.2″ length along the diagonal, 240×320 pixels resolution, supports SPI interface, and can be purchased for less than $10.<\/p>\n

\"2.2"<\/a>

2.2″ TFT LCD used in this tutorial is bought from a Chinese store on Aliexpress<\/p><\/div>\n

The connections between the TFT display and EasyESP-1 pins are as follows.<\/p>\n

\"Connections<\/a>

Connections between ILI9341 SPI TFT module and EasyESP-1<\/p><\/div>\n

Note that we will be using the hardware SPI module of the ESP8266 to drive the TFT LCD. The SPI communication pins are multiplexed with I\/O pins D5 (SCK), D6 (MISO), and D7 (MOSI). The chip select (CS) and Data\/Command (DC) signal lines are configurable through software.<\/p>\n

\"Complete<\/a>

Complete setup of LCD on the EasyESP-1 breadboard<\/p><\/div>\n

Software<\/h4>\n

For ILI9341-based TFT displays, there are some\u00a0options for choosing the library for your application. The most common one is using Adafruit’s library<\/a><\/strong> for ILI9341 display. You will also need their GFX-library<\/a><\/strong>\u00a0with this. There’s another one that I recently discovered named TFT ILI9341 ESP<\/a><\/strong>, and is more versatile than the Adafruit’s library. This is shared on github by Bodmer<\/a>. We will use this library in this tutorial. So go ahead and download the\u00a0TFT ILI9341 ESP<\/a><\/strong>\u00a0library, and install it in your Arduino\/libraries folder.<\/p>\n

About this library (in Author’s words):<\/p>\n

An Arduino IDE compatible graphics and fonts library for ESP8266 processors with a driver for the ILI9341 based TFT displays.<\/p><\/blockquote>\n

The library contains proportional fonts, different sizes can be enabled\/disabled at compile time to optimise the use of FLASH memory. The library has been tested with the NodeMCU (ESP8266 based).<\/p><\/blockquote>\n

The library is based on the Adafruit GFX and Adafruit ILI9341 libraries and the aim is to retain compatibility. Significant additions have been made to the library to boost the speed for ESP8266 processors (it is typically 3 to 10 times faster) and to add new features. The new graphics functions include different size proportional fonts and formatting features. There are a significant number of example sketches to demonstrate the different features.<\/p><\/blockquote>\n

Configuration of the library font selections, pins used to interface with the TFT and other features is made by editting the User_Setup.h file in the library folder. Fonts and features can easily be disabled by commenting out lines.<\/p><\/blockquote>\n

As mentioned by the author, you need to open the User_Setup.h file inside the main library folder and modify the following two lines to match with our setup.<\/p>\n

#define TFT_CS D2 \/\/ Chip select control pin
\n#define TFT_DC D1 \/\/ Data Command control pin<\/p>\n

Now you are all set to try out tons of\u00a0really cool built-in examples that come with the library. The following output corresponds to the TFT_Pie_Chart example.<\/p>\n

\"Drawing<\/a>

Drawing a colorful Pi Chart on TFT screen<\/p><\/div>\n

There is an example (TFT_Rainbow_one_lib.ino) for showing different size text fonts with rainbow colors in the background that looks pretty cool.<\/p>\n

\"Rainbow<\/a>

Rainbow colors demo<\/p><\/div>\n

\"fonts\"<\/a>

Another example of printing texts with different font sizes and colors<\/p><\/div>\n

My favorite example is TFT terminal, which implements a simple “Arduino IDE Serial Monitor” like serial receive terminal for monitoring debugging messages from another Arduino or ESP8266 board.<\/p>\n

\"serialterminal\"<\/a>

Serial receive terminal example<\/p><\/div>\n

Buy EasyESP-1 board<\/a><\/h4>\n

More tutorials<\/h4>\n

EASYESP-1: A RAPID PROTOTYPING AND DEVELOPMENT BOARD FOR ESP8266<\/a><\/h5>\n
TUTORIAL 1: SETTING UP THE ARDUINO IDE FOR EASYESP-1<\/a><\/h5>\n
TUTORIAL 2: EASYESP-1 \u201cHELLO WORLD\u201d EXAMPLE<\/a><\/h5>\n
TUTORIAL 3: CONNECTING AN OLED DISPLAY TO ESP8266<\/a><\/h5>\n
TUTORIAL 4: WORKING WITH ESP8266 WIFI SCAN CLASS<\/a><\/h5>\n
TUTORIAL 5: SETTING UP AN ESP8266 WEB SERVER<\/a><\/h5>\n
TUTORIAL 6: ESP8266 AND BME280 MAKE A LOCAL\/REMOTE WEATHER STATION<\/a><\/h5>\n","protected":false},"excerpt":{"rendered":"

In tutorial 3, we discussed how to use an SSD1306-driven I2C OLED screen with EasyESP-1 for displaying basic text and graphics. We used\u00a0a 0.96″ (along the diagonal) 128\u00d764 monochrome pixels OLED display for illustration. Despite its small size, the readability was pretty good due to its high contrast, which makes it a very good, compact size display for general applications. The excitement of having a display screen in an ESP8266 project can be further enhanced by upgrading the choice of display to colorful TFT LCD. One such screen that is readily available in the market at affordable price is ILI9341<\/p>\n","protected":false},"author":1,"featured_media":13195,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1603,1044,1464,1466],"tags":[1628,1629],"class_list":["post-13194","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-esp8266-tutorials","category-esp8266","category-featured","category-tutorials","tag-esp8266-ili9341-tft","tag-spi-lcd"],"_links":{"self":[{"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/posts\/13194","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/comments?post=13194"}],"version-history":[{"count":9,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/posts\/13194\/revisions"}],"predecessor-version":[{"id":15138,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/posts\/13194\/revisions\/15138"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/media\/13195"}],"wp:attachment":[{"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/media?parent=13194"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/categories?post=13194"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/embedded-lab.com\/blog\/wp-json\/wp\/v2\/tags?post=13194"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}