DFRobot's 2.8" TFT Touch Shield for Arduino
Wanna play with some graphic or make a touch interface? Use this DFRobot's Touch Shield for Arduino UNO!
Things used in this project
Software apps and online services
DFRobot Image Converter
Hand tools and fabrication machines
Add some flavor to your Arduino project with this large colorful touch screen by DFRobot. This TFT Touch screen is a fantastic shield with big (2.8" diagonal) and 240x320 pixels with individual pixel control which could apply to Arduino and mbed. It also comes with micro SD slot and 4 MB flash so you could add it easily to your projects with this 2.8" TFT Touch screen.
Model: DM-TFT28-105Display size: 2.8"Operating voltage: 3.3V or 5VResolution ratio: 240x320Communication Interface: SPIFlash memory: 4MBOperating temperature: -10~70℃Support micro-SD cardSupport ArduinoSize: 55*70 (W*H)mmViewing area：43.2*57.6 (W*H)mmWeight: 40g
TFT, Touch, SD-card and external flash memory pin mapping
Make your list:
Hardware components:Arduino UNO & Genuino UNO × 1DFRobot's 2.8" TFT Touch Shield x 1
Software apps and online services:Arduino IDEDFRobot Image Converter
Hand tools and fabrication machines:Stylus (generic)
First download the DmTftLibrary from dmtftlibrary. Extract the content to your Arduino library folder. In Windows this is usually located in Arduino IDE folder\libraries. Check Arduino's official guide if you want more information on how to install the Arduino Library. The official guide of Arduino. Start Arduino IDE, open the sample code, click "File--> Examples-> DmTftLibraries", select the right board and COM port: DM-TFT28-105 Open the Example and upload to your Arduino board.
Graphic Display Example
In the sketch -
tft.drawString(5, 10, "Romantic cabin");
tft.drawLine(x, y, x-80, y+30, YELLOW );
tft.drawRectangle(x-40, y+50,x-20, y+70, 0x8418);
tft.fillCircle(x+100, y-30, 20, RED );
The Drawing Board
Use stylus and don't do swipy movements to prevent unwanted dots on screen.
We can make a home made digital drawing board in just a few minutes. All we need are Arduino and this TFT shield.
Stack the shield on the Arduino.Connect the Arduino with the laptop and upload the sketch for drawing board.Wait for the screen to turn black.Now, swipe your finger on the screen and a line will be drawn. I didn't have but I would prefer you to use a stylus.
In the sketch
dmTouch.readTouchData(x, y, touched);
tft.fillCircle(x, y, 2, BLUE);
The syntax is:
<object_name>.fillCircle(x ,y, <point thickness>, <point color>);
Moreover, you can draw on it and to clear it, use the reset button on the screen to clear the graphics.
Display a pictures from a SD card
It requires a special format for the displaying picture: 16bit RGBRGB bmp. You could download the convert tool here: ImageConverter
Why 16 bit, not 24 bit?
There are 2 reasons for converting your images to 16-bit bmp with flipped row order:
Size: The image is only 2/3 of the original size and because most embedded displays/drivers uses 16-bit color, the picture quality will be the same. Speed: Most embedded TFT uses the 16-bit 565 format and support the top-bottom write order.
a) The MCU does not need to convert the 24-bit to 16-bit 565, this is already done.
b) If the source format is already in correct order, a faster algorithm for reading the data can be used.
c) There is less data to read (because the image is only 2/3 of an original size)
Compared to raw picture data, there are several advantages:
a) It has meta data about the format, size, how it is stored etc. With raw data, the program must already know this.
b) It is a standard so it can be viewed directly in most viewer (although not all viewer)
c) Can create and edit the images in advanced photo editing programs like photoshop.
Anyway, there is converted picture in the library folder (DmTftLibrary\examples\DM-TFT28-105). You could have a try with it first.
Copy the converted picture to the SD. Plug SD card in the touch screen. Upload the sketch given in the attachments.
Note: Install the SPIFlash library before you compile the sketch. Click here to download it form the GitHub.
The article was first published in hackster, August 29, 2017
author: Naman Chauhan