Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nothans/led-matrix-designer
An interactive web-based tool for designing LED matrix patterns and generating Arduino-compatible code. Perfect for creating custom displays for LED matrix projects.
https://github.com/nothans/led-matrix-designer
arduino arduino-uno-r4-wifi led-matrix
Last synced: 11 days ago
JSON representation
An interactive web-based tool for designing LED matrix patterns and generating Arduino-compatible code. Perfect for creating custom displays for LED matrix projects.
- Host: GitHub
- URL: https://github.com/nothans/led-matrix-designer
- Owner: nothans
- License: mit
- Created: 2024-11-03T17:50:35.000Z (17 days ago)
- Default Branch: main
- Last Pushed: 2024-11-03T18:15:17.000Z (17 days ago)
- Last Synced: 2024-11-03T18:29:54.567Z (17 days ago)
- Topics: arduino, arduino-uno-r4-wifi, led-matrix
- Language: HTML
- Homepage: https://led-matrix.nothans.com
- Size: 0 Bytes
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# LED Matrix Designer
An interactive web-based tool for designing LED matrix patterns and generating Arduino-compatible code. Perfect for creating custom displays for LED matrix projects.
## Features
- 🎨 Visual LED matrix designer with clickable pixels
- 📏 Adjustable matrix dimensions (up to 32x32)
- 🎯 Interactive drawing tools:
- Click to toggle individual pixels
- Click and drag to draw continuously
- Keyboard navigation support
- 🛠️ Matrix manipulation tools:
- Clear All
- Fill All
- Invert Pattern
- 🎨 Customizable active LED color
- 💻 Real-time Arduino code generation
- 📋 Copy-to-clipboard functionality
- 📝 Editable code output with live preview
- 📱 Responsive design for mobile and desktop
## Usage
1. Open the [LED Matrix Designer](https://led-matrix.nothans.com) in your web browser
2. Set your desired matrix dimensions (rows and columns)
3. Click on pixels to create your design
4. Customize the variable name for the generated code
5. Copy the generated code for use in your Arduino project
## Generated Code Format
The tool generates Arduino-compatible code in the following format:
```cpp
byte design[8][12] = {
{ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
{ 0, 1, 1, 0, 0, 0, 0, 0, 0, 1, 1, 0 },
{ 1, 1, 1, 1, 0, 0, 0, 0, 1, 1, 1, 1 },
{ 1, 1, 1, 1, 0, 0, 0, 0, 1, 1, 1, 1 },
{ 0, 1, 1, 0, 0, 0, 0, 0, 0, 1, 1, 0 },
{ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
{ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 },
{ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 }
};
```
### Arduino UNO R4 WiFi LED Matrix Code
```cpp
// Include the ArduinoGraphics library and the Arduino LED Matrix library
#include "ArduinoGraphics.h"
#include "Arduino_LED_Matrix.h"
// Create a new LED Matrix object
ArduinoLEDMatrix matrix;
// Define the LED Matrix design
byte design[8][12] = {
{ 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0 },
{ 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0 },
{ 1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1 },
{ 1, 0, 1, 0, 0, 0, 0, 0, 0, 1, 0, 1 },
{ 1, 0, 1, 0, 0, 0, 0, 0, 0, 1, 0, 1 },
{ 1, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 1 },
{ 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0 },
{ 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0 }
};
void setup() {
// Initialize the LED Matrix
matrix.begin();
// Render the design on the LED Matrix
matrix.renderBitmap(design, 8, 12);
}
void loop() {
}
```
## Packed Code Format
The tool also generates packed code to save program space on the Arduino. This format uses the loadFrame function of the Arduino LED Matrix library.
```cpp
const unsigned long design[] = {
0x555AAA55,
0x5AAA555A,
0xAA555AAA
};
matrix.loadFrame(design);
```
## Screenshots
| LED Matrix Designer App | Arduino UNO R4 WiFi |
|-------------|---------------------|
|  |  |