Controlling an LED Matrix with Arduino Tutorial
Overview
In this tutorial, we’re going to get started with using a WS2812B RGB LED Matrix Panel and an Arduino microcontroller.
If you’d like to get started with an LED Matrix and Arduino, check out our kit!
These panels allow us to produce amazing visual effects with the use of an Arduino digital pin and some basic circuitry. Whether you have an 8×8, 16×16, or another size panel, as long as they use WS2812B LEDs, this tutorial will help you get started. In this tutorial we’ll learn the following:
How to Build the Circuit.
What are Some Code Examples We Can Run
How to display custom images and animations
Lets get started!
How to Build the Circuit
Here’s a video on how to build the breadboard circuit to control the LED matrix with an Arduino Nano.
The following circuit diagram shows how to connect the RGB LED Matrix panel to the Arduino Nano’s pin 3 (although later you can change it to any pin).
Note: The GND wire of the LED panel is white.
Code Examples
Click the button below to download code samples for an 8×8 matrix. It will be downloaded in the form of a .ZIP file. Extract its contents to have access to the Arduino sketches.
Note: For the code to work, you’re going to have to install the FastLED library. You can do this in the Arduino IDE by going under Sketch -> Include Library -> Manage Libraries…
Then type ‘FastLED’ in the search bar and install the library.
Below is a table describing each file in the Code Samples folder:
| File Name | Function |
|---|---|
| 8x8_Basics | Shows basic functions that can be used to control the LED matrix |
| 8x8_Draw_Picture | Introduces basic functions to draw a simple picture onto the LED matrix. |
| 8x8_Draw_Picture_Animated | Introduces the concept of frame sequences to display animations. |
| 8x8_Fire | A fire visual effect. |
| 8x8_Pictures | 8×8 pixel images that you can use with the Image to Hex Converter. |
| Demo_Reel | A few extra visual effects that transition into one another. |
| Image to Hex Converter Installer | This is a Python program I wrote that allows you to easily convert images into pixel color data to use in the Arduino code. |
The first three sketches have comments included within the code to explain the main functions to give a better understanding of what it does and how to use it!
Custom Images and Animations
Custom Images
The process to create images onto LED matrices is a simple one with the Image to Hex Converter program I wrote! Download the ‘8×8 Matrix Code Samples’ above and install the file using the “Image to Hex Converter Installer”.
Once that’s done, you can begin using that program to convert images to hex arrays to be used in the Arduino code as seen in the following video:
Custom Animations
Creating custom animations follows the same pattern as creating custom images. In the “8x8_Draw_Picture_Animated” Arduino sketch, I converted the images from the “8×8” Pictures folder using the Image to Hex Converter tool. These frames are stored in the “frames.h” file to keep it neatly separated from the main sketch.
We then bundle each frame of our animation into another array. We can then refer to this frame array as a sequence. Here a “smileSequence” array is created, where the face has it’s eyes open one frame, and then its blinking the next frame:
As the comments mention, we can play the smileSequence using the ‘playAnimation’ function. It takes four parameters:
- The frame sequence variable
- The amount of frames in the sequence
- The amount of times to loop the animation. (Leave it at one to play it just once)
The amount of time, in milliseconds, between each frame.
