Arduino Stop Watch using ILI9328 2.4 inch Display

tft display

The sketch and all the images can be downloaded from my GitHub page here.

There are a number of versions of this ILI9328 TFT colour display, but the one shown in the picture above and here on eBay is designed to plug onto an Arduino and can use either 3.3 volt or 5 volt logic. There are a number of versions of this board that use 3.3 volt logic only and will need either a logic level converter or resistors on the logic pins.


This project uses the touch screen to start and stop the Stop Watch, the SD Card and loading and displaying images. I use the Adafruit Libraries and you will need the Adafruit_GFX.h (Core graphics library), the Adafruit_TFTLCD.h (Hardware-specific library) and the Adafruit Touchscreen.h (Touchscreen library). In addition you will need to download to your library folder SD.h and SPI.h libraries.

I wanted the display to look like an LED display so rather than printing the time I decided to go for a graphics approach. The sketch consists of three main parts, the clock section where a one second counter increments the variable secs from 0 to 59, the variable mins is incremented once every minute and the variable hrs is incremented once each hour. The second part checks the touch screen to see if one of the buttons has been pressed, so that the watch can be started, stopped and reset. The last part is the BMP file loader from the Adafruit test sketch, this loads a BMP graphic from the SD Card and displays it on the screen.

How it works::

Download the sketch and screen graphics from my GitHub page here and save the contents of the images folder to the root of the SD Card on the display. Upload the sketch then remove power and fit the display, reconnect the power to the Arduino and an image of a stopwatch is loaded from the SD Card and displayed on the screen. The LED display consists of five small graphics, hours, minutes and seconds and two colons and when these are loaded they overlay the graphic display. Touching the START button allows a timer to increment and each second the display is updated by loading new LED graphics. There are 59 graphics plus a colon and the stopwatch. It takes approximately 132ms to load each of the three graphics (hours, minutes and seconds) which is less than half a second in total. The timer uses the Arduino example sketch that times without using delay() and this allows the clock to keep reasonable time.

I could have simply printed the time as a string using txt.print(time, x, y) but the time display would need to be erased each time before printing the new time. Besides I think the LED graphics just look better. The colons could easily be made to flash every half second with just a small change to the Sketch.

The buttons are recognised by comparing the x,y values returned by the touchscreen library to the coordinates of an imaginary square around each button. The values in the sketch for the three buttons may need a small adjustment for individual screens, but touching the centre of the button should work in most cases.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s