Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

tronixstuff fun and learning with electronics

Get Motor Control PDF

Motor Control Topologies
from Analog Devices.
Home
Tronixlabs
Kit Reviews
Reviews
About
Contact Us

Categorized | arduino, bitmap, display, ILI9325, LCD, lesson, mega, TFT, tronixstuff,
tutorial

Tutorial Arduino and ILI9325 colour TFT LCD modules

Posted on 26 April 2013. Tags: arduino, bitmap, color, colour, display, henning, heyaodz10510,
HY-TFT240_262k, ILI9325, karlsen, LCD, mega, review, tft, touch, tronixstuff, tutorial, uno

Learn how to use inexpensive ILI9325 colour TFT LCD modules in chapter fifty of a series originally
titled Getting Started/Moving Forward with Arduino! by John Boxall A tutorial on
the Arduino universe. The first chapter is here, the complete series is detailed here.

Introduction

Colour TFT LCD modules just keep getting cheaper, so in this tutorial well show you how to get going
with some of the most inexpensive modules we could find. The subject of our tutorial is a 2.8 240 x 320
TFT module with the ILI9325 LCD controller chip. If you look in ebay this example should appear pretty
easily, heres a photo of the front and back to help identify it:

1 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

There is also the line HY-TFT240_262k HEYAODZ110510 printed on the back of the module. They
should cost less than US$10 plus shipping. Build quality may not be job number one at the factory so
order a few, however considering the cost of something similar from other retailers its cheap insurance.
Youll also want sixteen male to female jumper wires to connect the module to your Arduino.

Getting started

To make life easier well use an Arduino library UTFT written for this and other LCD modules. It has
been created by Henning Karlsen and can be downloaded from his website. If you can, send him a
donation this library is well worth it. Once youve downloaded and installed the UTFT library, the next
step is to wire up the LCD for a test.

Run a jumper from the following LCD module pins to your Arduino Uno (or compatible):

DB0 to DB7 > Arduino D0 to D7 respectively

RD > 3.3 V
RSET > A2
CS > A3
RW > A4
RS > A5
backlight 5V > 5V

2 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

backlight GND > GND

Then upload the following sketch Example 50.1. You should be presented with the following on your
display:

If youre curious, the LCD module and my Eleven board draws 225 mA of current. If that didnt work for
you, double-check the wiring against the list provided earlier. Now well move forward and learn how to
display text and graphics.

Sketch preparation

You will always need the following before void setup():

and in void setup():

with the former command, change orientation to either LANDSCAPE to PORTRAIT depending on how
youll view the screen. You may need further commands however these are specific to features that will be
described below. The function .clrScr() will clear the screen.

Displaying Text

There are three different fonts available with the library. To use them add the following three lines before
void setup():

When displaying text youll need to define the foreground and background colours with the following:

3 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

Where red, green and blue are values between zero and 255. So if you want white use 255,255,255 etc.
For some named colours and their RGB values, click here. To select the required font, use one of the
following:

Now to display the text use the function:

where text is what youd like to display, x is the horizontal alignment (LEFT, CENTER, RIGHT) or
position in pixels from the left-hand side of the screen and y is the starting point of the top-left of the text.
For example, to start at the top-left of the display y would be zero. You can also display a string variable
instead of text in inverted commas.

You can see all this in action with the following sketch Example 50.2, which is demonstrated in the
following video:

Furthremore, you can also specify the angle of display, which gives a simple way of displaying text on
different slopes. Simply add the angle as an extra parameter at the end:

Again, see the following sketch Example 50.2a, and the results below:

4 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

Displaying Numbers

Although you can display numbers with the text functions explained previously, there are two functions
specifically for displaying integers and floats.

You can see these functions in action with the following sketch Example 50.3, with an example of the
results below:

Displaying Graphics

Theres a few graphic functions that can be used to create required images. The first is:.

which is used the fill the screen with a certain colour. The next simply draws a pixel at a specified x,y
location:

Remember that the top-left of the screen is 0,0. Moving on, to draw a single line, use:

5 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

where the line starts at x1,y1 and finishes at x2,y2. Need a rectangle? Use:

where the top-left of the rectangle is x1,y1 and the bottom-right is x2, y2. You can also have rectangles
with rounded corners, just use:

instead. And finally, circles which are quite easy. Just use:

where x,y are the coordinates for the centre of the circle, and r is the radius. For a quick demonstration of
all the graphic functions mentioned so far, see Example 50.4 and the following video:

Displaying bitmap images

If you already have an image in .gif, .jpg or .png format thats less than 300 KB in size, this can be
displayed on the LCD. To do so, the file needs to be converted to an array which is inserted into your
sketch. Lets work with a simple example to explain the process. Below is our example image:

Save the image of the puppy somewhere convenient, then visit this page. Select the downloaded file, and
select the .c and Arduino radio buttons, then click make file. After a moment or two a new file will start
downloading. When it arrives, open it with a text editor youll see it contains a huge array and another
#include statement for example:

6 di 21 16/02/2017 09:47
Tutorial - Arduino and ILI9325 colour TFT LCD modules http://tronixstuff.com/2013/04/26/tutorial-arduino-and-ili9325-colour-tf...

Past the #include statement and the array into your sketch above void setup(). After doing that, dont be
tempted to autoformat the sketch in the Arduino IDE. Now you can use the following function to
display the bitmap on the LCD:

Where x and y are the top-left coordinates of the image, width and height are the width and height of
the image, and name is the name of the array. Scale is optional you can double the size of the image with
this parameter. For example a value of two will double the size, three triples it etc. The function uses
simple interpolation to enlarge the image, and can be a clever way of displaying larger images without
using extra memory. Finally, you can also display the bitmap on an angle using:

where angle is the angle of rotation and cx/cy are the coordinates for the rotational centre of the image.

The bitmap functions using the example image have been used in the following sketch Example 50.5,
with the results in the following video:

Unfortunately the camera doesnt really do the screen justice, it looks much better with the naked eye.

What about the SD card socket and touch screen?

The SD socket didnt work, and I wont be working with the touch screen at this time.

Conclusion

7 di 21 16/02/2017 09:47