2.8'' TFT Touch Shield v2.0


This is a versatile and Arduino/Seeeduino/Arduino Mega compatible resistive touch screen shield which can be used as display device, or sketch pad for user input/interface.

Compared with the previous version (2.8" TFT Touch Shield V1.0) we improved the screen driver with a professional chip (ILI9341) to provide the pin-saving SPI communication protocol without sacrificing the data transmission speed.

An SD card module is also integrated into the shield to provide storage space, and anything else you can think of, for your projects.




Features


Specification

Item Min Typical Max Unit
Voltage 4.5 5 5.5 VDC
Current / / 250 mA
LCD Panel Size 2.8 inch
View angle 60~120 Degree
Resolution 320 × 240 /
LCD color 65k /
Backlight Type LED /
LCD driver IC ILI9341 /
Interface Type SPI /
Touch Screen 4-Wire resistive touch screen /
Active area 43.2*57.3 mm
ESD contact discharge ±4 KV
ESD air discharge ±8 KV
Dimension 72.5 × 54.7 × 18 mm
Weight 24±2 g


Cautions


Pin Map and Description

Digital Pin Used

Arduino Pin Function
D0 Not Used
D1 Not Used
D2 Not Used
D3 Not Used
D4 TF_CS
D5 TFT_CS
D6 TFT_D/C
D7 Backlight Control
D8 Not Used
D9 Not Used
D10 Not Used
D11 SPI_MOSI
D12 SPI_MISO
D13 SPI_SCK

Analog Pin Used

Arduino Pin Function
A0 Y-
A1 X-
A2 Y+
A3 X+
A4 Not Used
A5 Not Used


Chip Select, Data/Command, and Backlight pins

Used for SD card chip select (CS) SPI pin.
This pin will indicate the shield that the Arduino wants to send and receive data to and from the micro SD card.

Used for touch screen chip select (CS) SPI pin.
This pin will indicate the shield that the Arduino wants to send and receive data to and from the display/screen.

Used for TFT Data/Command control pin.
The value of this pin (HIGH, or LOW) will tell the shield if the Arduino wants to send data or commands.

Used for touch screen backlight on/off control.

SPI Interface / Data Communication Pins

Used as data pin for SD card and screen. This pin is used by the Arduino to send data to the SD card or screen.

Used as data pin for SD card and screen. This is the pin that the Arduino uses to receive data from the SD card or screen.

Used as serial clock pin for SD card and screen. This pin is used to clock data in and out of the Arduino.


TFT Touch Shield Setup

Hardware Installation

Stack the TFT Touch Shield on your Arduino board and connect the board to the PC using a USB cable.

Software Libraries Installation

  1. Download the SeeedTFTV2.0 Library for Arduino 1.0 and SeeedTouchScreen Library for Arduino 1.0 by clicking "Download ZIP"
  2. Unzip the folders in the Arduino IDE path ..\arduino-1.0\libraries


Getting Started

Example #1:Draw a Circle

1. Restart the Arduino IDE.

2. Open the "drawCircle" example by going to File --> Examples --> SeeedTFTv2 --> drawCircle.

// drawCircle example
 
#include <stdint.h>
#include <TFTv2.h>
#include <SPI.h>
 
void setup()
{
    TFT_BL_ON;                                          //turn on the background light 
 
    Tft.TFTinit();                                      //init TFT library             
 
    Tft.drawCircle(100, 100, 30,YELLOW);                //center: (100, 100), r = 30 ,color : YELLOW              
 
    Tft.drawCircle(100, 200, 40,CYAN);                  //center: (100, 200), r = 10 ,color : CYAN  
 
    Tft.fillCircle(200, 100, 30,RED);                   //center: (200, 100), r = 30 ,color : RED    
 
    Tft.fillCircle(200, 200, 30,BLUE);                  //center: (200, 200), r = 30 ,color : BLUE                 
}
 
void loop()
{
 
}

3.   Upload the code to the Arduino board. You should be able to see several circles on the screen as shown below.


The TFT Touch Shield showing off some of its basic drawing capabilities.


Circles isn't the only thing our library can help you draw, we also have a lines, number, rectangle, and many more examples. Check those out as well to become a pro with the shield.


Code Explained

Let us show you how to use the drawCircle and fillCircle functions.

drawCircle:

Function Heading: drawCircle(int poX, int poY, int r, INT16U color)

Function Description: The drawCircle function draws an empty circle with the center at the coordinates poX, and poY. The circle will be of radius r and the border color will be color. The color parameter is a 16-bit Red-Geen-Blue (RGB) integer, in the example code above the words YELLOW, CYAN, RED, and BLUE are defined as integers in the TFTv2.h file.

RGB Integers: A 16-bit RGB integer specifies the amount of red, green, and blue to form a color. From right to left, bits 0-4, 5-10, and 11-15 specify the amount of blue, green, and red. For example, if you want to specify white as the color this will require an equal amount of red, green, and blue therefore the RGB integer for white will be 0xffff.

These are the colors defined in the TFT Touch Shield V2 library, but you can make your own of course:

//Basic Colors
#define RED		0xf800
#define GREEN	0x07e0
#define BLUE	0x001f
#define BLACK	0x0000
#define YELLOW	0xffe0
#define WHITE	0xffff
 
//Other Colors
#define CYAN		0x07ff	
#define BRIGHT_RED	0xf810	
#define GRAY1		0x8410  
#define GRAY2		0x4208

fillCircle:

Function Heading: fillCircle(int poX, int poY, int r, INT16U color)

Function Description: Draws a filled circle with center coordinates poX, and poY, with radius r and colored color.

Note: There are many other examples in this library (e.g "drawLines"), try them out to figure out how to use each of the draw functions.

Example #2: Display Images From The SD Card

This example will display a 320 × 240 24-bit-depth BMP image that you put in the micro SD card of the shield. This shows that you can toggle between the SD card and screen using the SPI protocol.

  1. Remove all power from the circuit.
  2. Using your PC save a 320 × 240 BMP image in the micro SD card and insert the SD card into the shield.
  3. Stack the shield on the Arduino board and connect the board to your to your PC's USB port.
  4. In the Arduino IDE, open the “tftbmp2” example in the same way as you opened the “drawCircle” example above.
  5. Upload the example code into the Arduino board.
  6. You should be able to see the BMP image(s) in the screen. Check out our results in the image below.


A beautiful yellow flower image we put in the TFT Touch Shield's SD card slot.


Example #3: Sketch Pad

This example shows how to make a sketch pad, with touch brushes of different colors.

  1. Open the “paint” the same way you opened the ”drawCircle” example above.
  2. Upload the code to the Arduino board.
  3. A color palette should be displayed on the right side of the screen to give the user different colors to choose from for his/her finger brush. The colors available in the palette are BLACK, RED, GREEN, BLUE, CYAN, YELLOW, WHITE, and GRAY1. Check out our artistic skills below!


Smiley face we made using the TFT shield as a sketch pad


Note: To clear the screen/canvas, simply press the reset button or power off and then power on the Shield.


Example #4: Backlight Control

The TFT Touch Shield's backlight is on by default since its control circuit is directly powered by the 5V pin. If, however, you wish to control the backlight's on/off state using the Arduino Digital I/O pin 7, a simple modification will have to be made:

Note: Please read ALL of the following steps first before performing any action.

1. Find the back light's three terminals' locations (ON, BACKLIGHT, D7) in the back/bottom side of the shield (see figure below).

Backlight terminals location.

2. Notice that the ON terminal is soldered to the BACKLIGHT terminal as shown in the PCB figure below. Scrape off this connection, or use a soldering iron to remove it.

The default connection of the backlight (ON connected to BACKLIGHT).

3. Now solder the D7 terminal to the BACKLIGHT terminal as shown in the PCB figure below.

The required modification to control the backlight using digital pin 7 (connect BACKLIGHT to D7)

Now controlling the backlight's state is as easy as controlling an LED, upload the following code to the Arduino board to see how to toggle the backlight every 500ms (1/2 second):

#define Backlight 7
void setup(void)
{
 pinMode(Backlight,OUTPUT); 
}
void loop(void)
{ digitalWrite(Backlight,HIGH); // turn on the backlight
 delay(500);
 digitalWrite(Backlight,LOW);  // turn off the backlight
 delay(500);
}


Related Projects

The best way to learn something is to create a project with it.

Recipe Community is a place which gathers a lot of amazing projects with step-by-step tutorials. Makers in the community have made an awesome project with the TFT Touch Shield V2.0, check this out!

Make an Instructables Indicator

Instructables is really a good place to share your awesome project. There are so many makers here to share their works.

I had made many instructable as well, I will feel excite when my instructable get a large views or favorites. Especially when you first post your instructable, you will always go to the page and see if someone like it.

I still remember when I post my first Instructable post years ago, it's a project about Arduino, I made a phone with Arduino. It's called ArduinoPhone, even today I can get some comments from it, and I am glad to help others to make their own phone with Arduino.

Now, I will share my latest instructions, it's a beautiful device that you can put it on the desk. It's named Instructables Indicator. With this instructable, you can know people like your Instructable if your Instructable posts get featured.

This application contains the below function:

Connecting to Wi-Fi

If you like Instructables and write instruction post, you will like this idea. I will share the process to make it, as well as the code, all things are open sources.


ArduinoPhone

Combining Arduino and other shield modules, we make a mobile phone named Arduino Phone. Meanwhile, we printed a shell for it with the 3D printer. Although it's not such fine as you think, even a little bit clunky, it's still very cool. That is the point this is a cell phone made by ourselves.

While, we can't install Arduino Phone Apps limited by Arduino. So, if you want to play Angry Birds, then you need to do some big modifications on Arduino Phone. :)

Next, I will make a detailed explanation about the steps of making an Arduino Phone, including the hardware connection and software implementation.

Now, let's begin.


Resources


Help us to make it better

Copyright (c) 2008-2016 Seeed Development Limited (www.seeedstudio.com / www.seeed.cc)
This static html page was created from http://www.seeedstudio.com/wiki