Introduction: TFT Touch Screen Animation Engine and 8x8 RGB LED Matrix Controller
This embedded application has heaps of creative potential for any aspiring Arduino fanatics! A TFT Touch Screen Animation Engine and optional 8x8 RGB LED Matrix Controller. Watch the introduction video for more details:
What you need:
- TFT Touch Screen with SD socket - I used an UNO R3 2.8" TFT Touch Screen (the source code was tested on this TFT and some settings may be different for other TFTs).
- SD Micro (inserts into TFT SD Socket)
- Arduino: a Mega to control the optional 8x8 LED matrix or an UNO for standalone TFT operation
Optional: I've created an instructional to build the 8x8 RGB LED Matrix breakout board so I won't go into details in this instructional. You can find the build here: https://www.instructables.com/id/Arduino-8x8-RGB-LE...
- 8x8 RGB LED Matrix
- Breadboard to connect the 8x8 matrix to the shift registers.
- 24 resistors (220 Ohm)
- 4 Shift Registers (74HC595)
- Lots of jumper wire to make all the connections.
Step 1: Get the Source Code
Download and install the source code sketch and libraries below. These are needed to interface with the UNO R3 2.8 TFT Touch Screen.
Another useful resource: SD library reference: https://www.arduino.cc/en/Reference/SD
You need to unzip and extract the folders containing the .h and .cpp files into the arduino programs library directory: C:\Program Files (x86)\Arduino\libraries
Watch the source code video demonstration and copy the code into your own sketch. There is a link in the video to download the source code from github. Some of the programming concepts covered:
- State Management
- Confirmation Events
- Data Files
- Button Management
Step 2: Connect 8x8 LED Matrix (optional)
You will need to construct the matrix. You can follow the instructable here:
The TFT Touch Screen takes up most of the pins on an Arduino UNO. So, for this build I used a Mega 2560. The TFT shield covers a lot of the Mega but there are still plenty of pin outs available. Refer to the diagram image for more detailed wiring information. The table below shows the difference between the UNO setup and Mega. (Note: these settings are specific to my UNO R3 TFT 2.8" Touch Screen with SD. A different brand may require different settings.)UNOMega
int DATA = 3;
int DATA_OUTPUT_ENABLE = 4;
int LATCH = 5;
int CLOCK = 6;
int RESET = 7;
int DATA = 22;
int DATA_OUTPUT_ENABLE = 24;
int LATCH = 26;
int CLOCK = 28;
int RESET = 30;
Step 3: Create Animations
There's unlimited creative potential for creating your own animations. You can create long messages that display like a flashing marquee. You can also create designs, icons, avatars and put them all in motion. After saving to the built in SD card you can then copy the files to a computer to backup your creations.
- Different fonts
- Message marquee
- Avatar animation
- Animated designs
After the source code overview, this video has some instructions and demonstrations on creating, saving and playing more animations.
Step 4: Extend the Application
There's many things you can do with this application. Here's a few ideas on how you can make it better and take it to the next level:
From a programming perspective I would love to do all of these things. Perhaps I will in a future version.
- single frame editing
- infinite play with loop breakout
- more than 10 files
- different drawing methods
- char by char
- line by line
- frame by frame
- scrolling in frames from various directions.
There are also many real world scenarios where this application could be implemented. Here's some ideas:
- Connect to a motion detector and display a message on motion detection. For example, place the 8x8 in a shop window and display a custom "Out to Lunch" message activated by motion.
- Place the 8x8 in the rear window of a car to display polite messages.
If you need help with your embedded Arduino applications or need clarification on any of my Instructables please send me a message or post a comment.
If you get a chance to build this embedded application, please share your animations. I'd love to see what you come up with!
We have a be nice policy.
Please be positive and constructive.