LED Matrix Editor

Published

Introduction: LED Matrix Editor

About: Software engineer

There are some ways how to store this kind of matrix in the Arduino code.

Like this:

byte image[] = {
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 1, 1, 0, 0, 0,
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 0, 1, 0, 0, 0,
    0, 0, 0, 1, 1, 1, 0, 0
}

or this:

byte image[] = {
    0b00001000,
    0b00011000,
    0b00001000,
    0b00001000,
    0b00001000,
    0b00001000,
    0b00001000,
    0b00011100
}

but what if you going to make an animation from a large number of frames?

Step 1: LED Matrix Editor

LED Matrix Editor - the online tool for animating your matrix.

It looks very simple, but it has some handy features:

  • Online, free and safe. No additional software required.
  • Toggle LEDs using a mouse
  • Toggle a whole row or column by clicking the appropriate matrix's index
  • Shift the matrix Up, Down, Left or Right via the single click
  • Invert or Clear matrix
  • Collect matrices in the bottom pane and then reorder them using the Drag-and-Drop
  • Update images as well as insert new or delete existing
  • Save images as a C code for Arduino
  • Use browsing history and save images as a link or bookmark, so you never lost your creations

Step 2: LED Matrix Arduino Code

Make your animation and then put generated code into the your Arduino project:

Like here:

#include <LedControl.h>

const int DIN_PIN = 7; const int CS_PIN = 6; const int CLK_PIN = 5;

const uint64_t IMAGES[] = { 0x3e2222223e3e0808, 0x3e22223e3e2a0808, 0x3e223e3e2a2a0808, 0xbe3e3e2a2a2a0808, 0xbe223e3e2a2a0808, 0xbe22223e3e2a0808, 0xbe2222223e3e0808, 0xbe22223e3e2a0808, 0xbe223e3e2a2a0808, 0xbebe3e2a2a2a0808, 0xbea23e3e2a2a0808, 0xbea2223e3e2a0808, 0xbea222223e3e0808, 0xbea2223e3e2a0808, 0xbea23e3e2a2a0808, 0xbebebe2a2a2a0808, 0xbea2be3e2a2a0808, 0xbea2a23e3e2a0808, 0xbea2a2223e3e0808, 0xbea2a23e3e2a0808, 0xbea2be3e2a2a0808, 0xbebebeaa2a2a0808, 0xbea2bebe2a2a0808, 0xbea2a2be3e2a0808, 0xbea2a2a23e3e0808, 0xbea2a2be3e2a0808, 0xbea2bebe2a2a0808, 0xbebebeaaaa2a0808, 0xbea2bebeaa2a0808, 0xbea2a2bebe2a0808, 0xbea2a2a2be3e0808, 0xbea2a2bebe2a0808, 0xbea2bebeaa2a0808, 0xbebebeaaaaaa0808, 0xbea2bebeaaaa0808, 0xbea2a2bebeaa0808, 0xbea2a2a2bebe0808, 0xbea2a2a2a2be1c08, 0xbea2a2a2a2a21c1c, 0xbea2a2a2a222001c, 0xbea2a2a22222001c, 0xbea2a2222222001c, 0xbea222222222001c, 0xbe2222222222001c, 0x3e2222222222001c, 0x3e2222222222001c, 0x3e22222222221c1c, 0x3e222222223e1c08 }; const int IMAGES_LEN = sizeof(IMAGES) / sizeof(uint64_t);

LedControl display = LedControl(DIN_PIN, CLK_PIN, CS_PIN);

void setup() { display.clearDisplay(0); display.shutdown(0, false); display.setIntensity(0, 10); }

void displayImage(uint64_t image) { for (int i = 0; i < 8; i++) { byte row = (image >> i * 8) & 0xFF; for (int j = 0; j < 8; j++) { display.setLed(0, i, j, bitRead(row, j)); } } }

int i = 0;

void loop() { displayImage(IMAGES[i]); if (++i >= IMAGES_LEN ) { i = 0; } delay(100); }

Step 3: LED Matrix Animation

Then connect Arduino and Matrix, upload code and have fun :-)

Share

    Recommendations

    • Creative Misuse Contest

      Creative Misuse Contest
    • Water Contest

      Water Contest
    • Clocks Contest

      Clocks Contest

    24 Discussions

    Hi,

    I just added option to save images as arrays of bytes.

    So now the generated code should be compatible with all Arduinos.

    Best regards

    led-matrix-editor-bytes.png
    3 replies

    Any chance of adding a "play animation" option that plays all the frames in your browser so that you can check how it looks animated (i.e. your motor frames)?

    Just added animation )

    https://xantorohara.github.io/led-matrix-editor/

    hello

    very nice, this appli is awesome.

    thanks a lot

    i ve tested with byte, it work very good.

    the new icon you juste added are very nice (font) too.

    But if we want to use them it will be long to delete the unnecesasry icon.

    it s not possible to mixe icon from a link to an other.

    Hello, thanks for sharing this editor - the pupils really like programming their leds! Keep up the good work!

    Do you also have an offline version of your editor?

    An animated view of the frames would also be really useful (like in Piskel for instance). Any chance that this will be available at some point?

    Thanks!

    4 replies

    Thanks my friend, your work on the animation feature is very much appreciated - it's really useful.

    Fantastic!!!

    Checkout new functionality and design of the LED Matrix editor )

    led-matrix-2.png

    I thought about the offline version as well as implementation of a "Play" button.

    If I have time, I'll do it in the near future.

    I will notify you here :-)

    Hello,
    I saw that you had proposed a version 8 bits. Is this still planned ? This would be compatible with all versions of Arduino . It would be perfect for us.
    But I do not know if you have the opportunity to do that.
    In any case thank you to you.

    Best regards

    Thanks for all !

    2 replies

    Thanks for your new version of LED Matrix Editor...

    It's very fun project !

    Best regards and thanks again !

    Hi, guys

    Thanks for your comments.

    I see that some of you are experiencing problems with uint64_t data type.

    If you want, I'll add the option to represent every image as a 8-byte array (so the both forms will be available).

    What you think?

    3 replies

    Hello,
    good job but i have a little problem with Arduino 1.05-r2 and this example ...
    The number 0x------ is too long !
    problem with uint64_t...
    Best regards

    2 replies

    Hi,

    Could you try the current version of the Arduino IDE (Arduino 1.6.5)?
    It has a lot of improvements and updated AVR-GCC compiler.

    It has 64-bit integer type:
    typedef unsigned long long int uint64_t;

    defined in this file:
    "C:\Program Files (x86)\Arduino\hardware\tools\avr\avr\include\stdint.h"


    Let me know if it'll work or not for you.

    It's Arduino 1.05. i can't used Arduino 1.6.5 because i work with Arddublock plug'in. But i can see in the AVR-GCC.
    Thanks !
    Best regards !

    Hello

    i've add the lib : ledcontrol

    but arduino don t compile.

    i have a bug on first line after : const uint64_t IMAGES[]

    he said : integer constant is too large for long type.

    should i add an other lib and witch one ?

    it will be great if it compile.