Using Buttons to Control LED Matrix Patterns on ESP32

Using buttons to control LED matrix patterns on ESP32 is an exciting way to bring interactivity to your projects. By combining tactile inputs with visually engaging LED displays, you can create everything from dynamic animations to interactive games. This project setup not only enhances your understanding of microcontrollers but also allows you to experiment with creative designs and coding techniques.

The ESP32 microcontroller, with its robust capabilities and compatibility with LED matrices like the MAX7219, is perfect for managing button inputs and dynamic displays. In this article, we’ll explore how to set up and program your ESP32 to use buttons for controlling LED matrix patterns. Whether you’re a beginner or an experienced maker, this guide will help you take your projects to the next level.


Table of Contents


Understanding the Basics

The ESP32 Microcontroller: This powerful, Wi-Fi-enabled microcontroller is perfect for managing complex interactions like button inputs and LED matrix displays. With its robust GPIO capabilities and MicroPython support, the ESP32 is a favorite among hobbyists and professionals alike.

LED Matrix Overview: An LED matrix consists of rows and columns of LEDs, which can be controlled individually to display patterns, animations, or even scrolling text. The MAX7219 driver module simplifies communication between the ESP32 and the matrix.

Buttons as Inputs: Buttons provide tactile control, allowing users to interact with projects. By mapping button presses to specific patterns or actions, you can add a dynamic and interactive element to your LED matrix.


Setting Up Your Hardware

To get started, you’ll need:

  • An ESP32 board
  • A MAX7219 8×8 LED matrix module
  • Push buttons (2-4 for basic control)
  • Jumper wires and a breadboard

Connections:

An ESP32 microcontroller connected to an LED matrix on a breadboard using the following pin assignments: DIN to GPIO23, CS to GPIO5, CLK to GPIO18, and power rails connected to VCC and GND. Four buttons are also wired to GPIO4, GPIO19, GPIO21, and GPIO34 with pull-down resistors. GPIO34-39 are input-only pins and require no configuration for pull-up or pull-down resistors.
LED Matrix and Button Connections on a Breadboard with ESP32.
  1. Connect the LED matrix to the ESP32 using the following pin assignments:
    • DIN to GPIO23
    • CS to GPIO5
    • CLK to GPIO18
    • VCC and GND to the power rails (3.3V or 5V as required by your setup).
  2. Connect the buttons to GPIO4, and GPIO19, GPIO21, GPIO34, GPIO35 with pull-down resistors to ensure stable readings.

Coding the Interaction

Using MicroPython, you can program your ESP32 to handle button inputs and control LED matrix patterns:

  1. Install Required Libraries: Use the https://github.com/srgalope/micropython-max7219v2024 library to simplify LED matrix control.
  2. Detect Button Presses: Write code to read button states and debounce inputs for reliable interaction.
  3. Map Patterns to Buttons: Create different LED matrix patterns (e.g., animations, icons, or text) and associate them with button presses.

Here’s a basic example:

from machine import Pin, Timer, SPI
from max7219 import Matrix8x8
import IconsLibrary
from time import sleep

# Buttons
heart_button = Pin(4, Pin.IN, Pin.PULL_UP)
square_button = Pin(19, Pin.IN,  Pin.PULL_UP)
circle_button = Pin(21, Pin.IN,  Pin.PULL_UP)
party_button = Pin(34, Pin.IN)
start_button = Pin(35, Pin.IN)

# LED Matrix
spi = SPI(1, baudrate=10000000, polarity=0, phase=0, sck=Pin(18), mosi=Pin(23))
matrix = Matrix8x8(spi, Pin(5), 1)

matrix.fill(0)  # Clear the display
matrix.brightness(0)

def display_pattern(display, pattern):
    display.fill(0)
    for row_index, row_value in enumerate(pattern):
        for col_index, pixel in enumerate(row_value):
            if pixel == '1':  # If the pixel is on (1)
                display.pixel(col_index, row_index, 1)  # Turn on the pixel
    display.show()  # Update the display to reflect changes

display_pattern(matrix, IconsLibrary.SMILEY)

# Loop
while True:
    heart_state = heart_button.value()
    square_state = square_button.value()
    circle_state = circle_button.value()
    party_state = party_button.value()
    start_state = start_button.value()    
    
    print('heart ',heart_state,' square', square_state, 'circle', circle_state, 'party', party_state, 'start', start_state)
    
    if heart_state == 0:
        display_pattern(matrix, IconsLibrary.HEART_HOLLOW)

    if square_state == 0:
        display_pattern(matrix, IconsLibrary.SQUARE_HOLLOW)

    if circle_state == 0:
        display_pattern(matrix, IconsLibrary.CIRCLE_HOLLOW)

    if party_state == 1:
        display_pattern(matrix, IconsLibrary.X)
        sleep(3)
        display_pattern(matrix, IconsLibrary.APT)
        sleep(7)
        display_pattern(matrix, IconsLibrary.SMILEY)
        
    if start_state == 1:
        display_pattern(matrix, IconsLibrary.SMILEY)

    sleep(.4)


Expanding Your Project

  • Adding More Buttons: Introduce additional buttons to control more patterns or trigger animations.
  • Implementing Long Press: Use long and short presses to add functionality without increasing button count.
  • Interactive Games: Develop simple games like Snake or Pong, where buttons control gameplay.

Conclusion

Using buttons to control LED matrix patterns on ESP32 is an excellent way to make your projects interactive and engaging. By connecting buttons to an LED matrix, you unlock the potential for creative displays, dynamic animations, and even simple games. This hands-on approach not only enhances your technical skills but also allows for endless experimentation and learning.

If you’re looking for inspiration or resources to elevate your project, be sure to explore our LED Matrix Icons Library. It’s a fantastic starting point for creating unique and visually appealing designs. Dive in and let your creativity shine!

Leave a Comment