This tutorial is part of: ESP32-S3 RGB LED матрица
Одличен проект за креирање за забавни и практични апликации со користење на ESP32-S3 RGB Matrix модулот. Линкови до други видеа се наоѓаат под оваа статија.
ESP32-S3 RGB LED матрица проект 6 - Игра „Цел“
Проект 6 – Игра „Цел“ (Наклонување на плочата за да ја погодите кружницата)
Проектот 6 е последниот и најинтерактивниот проект во оваа серија ESP32-S3 RGB LED матрици. Користејќи го вградениот QMI8658C сензор за движење, ја наклонувате плочата за да поместите точка околу матрицата 8×8. Кружна „зона на цел“ се наоѓа во средината на екранот. Кога вашата точка ќе ја допре кружницата, бојата се менува и (опционално) зумерот писка. Ова создава едноставна, но изненадувачки забавна игра за рамнотежа/координација.
Сите шест проекти се прикажани во едно YouTube видео (вградено на оваа страница). Целосниот код за играта се вчитува автоматски под овој напис, а affiliate линкови за купување на модулот се појавуваат под делот со кодот.

Преглед на ESP32-S3 RGB LED матричен модул
Овој модул вклучува:

- ESP32-S3 микроконтролер (Wi-Fi + BLE)
- 8×8 RGB LED матрица (64 адресирани LED диоди)
- QMI8658C акцелерометар за сензорика на наклон и ориентација
- USB-C порт за напојување и програмирање
- Boot / Reset копчиња
- Достапни GPIO пинови за додатоци како зумери или сензори
За оваа игра, акцелерометарот е од суштинско значење—тој континуирано известува за X/Y наклон, овозможувајќи точката да се движи непречено врз основа на аголот на плочата. Видео делот за овој проект јасно покажува како точката се лизга и реагира додека ја наклонувате плочата лево/десно/напред/назад.

Проекти опфатени во видеото (Временски ознаки)
- 00:00 – Вовед
- 02:01 – Инсталирање на ESP32 плочи
- 03:32 – Инсталирање библиотеки
- 05:32 – Проект 1: Движечка точка
- 11:11 – Проект 2: Текст со лизгање
- 12:59 – Проект 3: HTTP текст
- 16:41 – Проект 4: Наклонета точка
- 18:55 – Проект 5: Стрелка нагоре
- 20:02 – Проект 6: Игра „Цел“ (овој проект)
Овој дел од видеото ги прикажува и движењето на точката и логиката за детекција на кружницата во акција, што го олеснува разбирањето како се однесуваат координатите.

Инсталирање на ESP32 плочи во Arduino IDE
Ако веќе сте ги завршиле претходните проекти, инсталацијата на плочата е завршена. Во спротивно следете:
File > Preferences→ Додадете ESP32 URL за плоча.Tools > Board > Boards Manager…→ Инсталирајте „ESP32“.- Изберете ја ESP32-S3 плочата под
Tools > Board. - Изберете ја точната COM порта под
Tools > Port.
Инсталирање на потребните библиотеки
Оваа игра користи:
Adafruit NeoMatrixAdafruit NeoPixelAdafruit GFXQMI8658(сензор за движење)
Инсталирајте ги преку:
Sketch > Include Library > Manage Libraries…- Пребарајте: NeoMatrix → Инсталирајте
- Инсталирајте ги зависностите (GFX + NeoPixel)
- Пребарајте и инсталирајте QMI8658
Како функционира играта „Цел“
QMI8658C акцелерометарот обезбедува вредности за наклон X и Y. Тие се мапираат на LED координати (0–7 во двете насоки). Вашата точка се движи низ матрицата врз основа на аголот на плочата.
Кружница (или прстен) е исцртана на екранот како „област на целта.“ Победувате „погодок“ секогаш кога точката ќе ја преклопи кружницата. Во тој момент:
- Бојата на целта се менува (случајна или однапред дефинирана)
- Опционален зумер писка (ако е поврзан)
Бидејќи матрицата е мала, кружницата е исцртана со едноставна проверка на радиус. Играта работи континуирано, па можете да наклонувате напред-назад за да ја погодувате кружницата постојано.
Проект 6 – Поставки на кодот (Игра „Цел“)
Подолу се главните поставки што корисникот може да ги прилагоди, лоцирани на врвот на скицата. Целосниот код е автоматски вклучен под овој напис.
Конфигурација на матрицата
// Конфигурација на матрицата
const int MATRIX_PIN = 14;
const int MATRIX_WIDTH = 8;
const int MATRIX_HEIGHT = 8;
RGB матрицата е директно поврзана на GPIO 14—не менувајте го ова.
Осветленост
uint8_t matrixBrightness = 40; // 0–255
За внатрешна употреба, 30–60 е идеално.
Боја на точката
// Боја на точката (R, G, B)
uint8_t dotRed = 255;
uint8_t dotGreen = 255;
uint8_t dotBlue = 255;
Ова е точката што ја движите со наклонување на плочата.
Боја на кружницата (Случајна или фиксна)
// Боја на кружницата (целта)
uint8_t circleRed = 0;
uint8_t circleGreen = 0;
uint8_t circleBlue = 255;
// Ако е точно, изберете нова случајна боја секој пат кога точката ќе ја погоди
bool randomCircleColor = true;
Поставете randomCircleColor = false; ако сакате фиксна боја.
Радиус на кружницата
// Големина на целта (радиус)
int targetRadius = 3; // 3 одговара добро на матрица 8×8
Поголеми радиуси ја прават играта полесна; помали ја прават потешка.
Чувствителност на наклон
// Чувствителност на мапирање на наклон
float tiltScale = 4.0f; // зголемете = побрзо движење низ екранот
Ако точката се движи пребрзо или скока, намалете го овој број.
Поставки за зумер (Опционално)
// Пин за зумер (опционално)
int buzzerPin = 6; // поврзете го зумерот + на пин 6, – на GND
bool useBuzzer = true; // поставете false за да го исклучите звукот
Ако не поврзете зумер, едноставно поставете useBuzzer = false;
Резиме
Проектот 6 ги комбинира сите научени работи од претходните проекти: цртање матрица, влез од акцелерометар, контрола на боја, измазнување на движењето и опционален звук. Навалувањето на плочата ја движи точката, а удирањето на кругот ја менува неговата боја и (опционално) активира звучен сигнал. Тоа е забавна демонстрација на детекција на движење на компактен RGB дисплеј.
Целосниот код за „Игра со цел“ автоматски се прикажува под овој напис. Можете исто така да го погледнете делот од видеото за Проект 6 за да видите како се движи точката и како се детектираат ударите. Ако сакате да изградите сопствена игра, партнерски линкови за купување на ESP32-S3 RGB LED матричен модул се појавуваат под делот со код.
This tutorial is part of: ESP32-S3 RGB LED матрица
- ESP32-S3 RGB LED матричен проект 1 - Основна точка
- ESP32-S3 RGB LED матричен проект 2 - Лизгачки текст
- Проект 3 со RGB LED матрица на ESP32-S3 - Текст од мобилен телефон
- Проект 4 со RGB LED матрица на ESP32-S3 - Тилт точка
- ESP32-S3 RGB LED матричен проект 5 - Стрелка секогаш нагоре
- ESP32-S3 RGB LED матрица Wi-Fi + NTP часовник проект -1 Основен часовник
- Проект за интернет часовник со RGB LED матрица базиран на ESP32-S3 - 2 часовници со повеќебоен приказ на време и датум
- ESP32-S3 RGB LED матричен интернет часовник проект - 3 ноќни бои со датум
- Проект за интернет часовник со RGB LED матрица базиран на ESP32-S3 - 5 виножито боја
- Проект за интернет часовник со RGB LED матрица базиран на ESP32-S3 - 4 случајни бои
- ESP32-S3 RGB LED Matrix test for RGB, GRB setting
/*
Project 6: Tilt Circle Game – ESP32-S3 RGB LED Matrix (Waveshare)
This sketch reads tilt from the QMI8658C IMU and smoothly moves a dot
on the 8×8 RGB LED matrix based on board orientation.
▶️ Video Tutorial:
https://youtu.be/JKLuYrRcLMI
📚⬇️ Resources & Code Page:
https://robojax.com/RJT829
QMI8658_RGB_2
*/
#include <Arduino.h>
#include <math.h>
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
#include <QMI8658.h> // by Lahav Gahali
// -------- LED MATRIX SETUP --------
#define MATRIX_PIN 14
#define MATRIX_WIDTH 8
#define MATRIX_HEIGHT 8
// Buzzer pin – change this to your actual buzzer GPIO.
const int BUZZER_PIN = 6; // TODO: set to your buzzer pin
// Matrix brightness (0–255)
const uint8_t MATRIX_BRIGHTNESS = 10;
Adafruit_NeoMatrix matrix = Adafruit_NeoMatrix(
MATRIX_WIDTH, MATRIX_HEIGHT, MATRIX_PIN,
NEO_MATRIX_TOP + NEO_MATRIX_LEFT +
NEO_MATRIX_ROWS + NEO_MATRIX_PROGRESSIVE,
NEO_GRB + NEO_KHZ800
);
// -------- IMU SETUP --------
QMI8658 imu;
// -------- GAME CONFIG --------
// How often the dot is allowed to move (ms).
// Bigger = slower movement.
const uint16_t MOVE_INTERVAL_MS = 150; // try 120–250
// How much tilt (m/s^2) before the dot moves.
// Increase if it feels too sensitive.
const float ACC_TILT_THRESHOLD = 2.0f; // about ~0.2 g
// Dot base color (RGB)
const uint8_t DOT_R = 255;
const uint8_t DOT_G = 255;
const uint8_t DOT_B = 255;
// Circle geometry (centered on 8x8)
const float CIRCLE_CENTER_X = (MATRIX_WIDTH - 1) / 2.0f; // 3.5
const float CIRCLE_CENTER_Y = (MATRIX_HEIGHT - 1) / 2.0f; // 3.5
const float CIRCLE_RADIUS = 3.0f;
const float CIRCLE_THICKNESS = 0.8f; // +- thickness around radius
// -------- GAME STATE --------
// Dot position on the 8x8 grid (0..7)
int dotX = 3;
int dotY = 3;
// Colors (16-bit NeoMatrix colors)
uint16_t dotColor;
uint16_t circleColor;
// To detect “just touched circle” vs “still on circle”
bool wasOnCircle = false;
// Timer for rate-limiting movement
unsigned long lastMoveTime = 0;
// -------- HELPER FUNCTIONS --------
// Classic NeoPixel color wheel (0-255 -> rainbow)
uint16_t wheel(byte pos) {
if (pos < 85) {
return matrix.Color(pos * 3, 255 - pos * 3, 0);
} else if (pos < 170) {
pos -= 85;
return matrix.Color(255 - pos * 3, 0, pos * 3);
} else {
pos -= 170;
return matrix.Color(0, pos * 3, 255 - pos * 3);
}
}
// Is a given pixel approximately on the circle?
bool isOnCircle(int x, int y) {
float dx = x - CIRCLE_CENTER_X;
float dy = y - CIRCLE_CENTER_Y;
float d2 = dx * dx + dy * dy;
float rMin = CIRCLE_RADIUS - CIRCLE_THICKNESS;
float rMax = CIRCLE_RADIUS + CIRCLE_THICKNESS;
return (d2 >= rMin * rMin) && (d2 <= rMax * rMax);
}
// Draw circle + dot
void drawScene() {
matrix.fillScreen(0);
// Draw circle
for (int y = 0; y < MATRIX_HEIGHT; y++) {
for (int x = 0; x < MATRIX_WIDTH; x++) {
if (isOnCircle(x, y)) {
matrix.drawPixel(x, y, circleColor);
}
}
}
// Draw dot (on top)
matrix.drawPixel(dotX, dotY, dotColor);
matrix.show();
}
// Simple blocking beep (short)
void buzzOnce() {
digitalWrite(BUZZER_PIN, HIGH);
delay(40);
digitalWrite(BUZZER_PIN, LOW);
}
// Use accelerometer to decide dot movement
void updateDotFromTilt(float ax, float ay) {
unsigned long now = millis();
if (now - lastMoveTime < MOVE_INTERVAL_MS) {
return; // too soon, wait
}
int dx = 0;
int dy = 0;
// On this board, Y tilt feels like "left/right" on the matrix,
// and X tilt feels like "up/down" → so we swap.
// --- Horizontal movement from AY (tilt left/right) ---
if (ay > ACC_TILT_THRESHOLD) {
dx = 1; // tilt to the right → move dot to the right
} else if (ay < -ACC_TILT_THRESHOLD) {
dx = -1; // tilt to the left → move dot to the left
}
// --- Vertical movement from AX (tilt forward/back) ---
// This was inverted. We flip the signs:
// ax > threshold = tilt "forward" (away) → move dot UP (dy = -1)
// ax < -threshold = tilt "back" (toward)→ move dot DOWN(dy = 1)
if (ax > ACC_TILT_THRESHOLD) {
dy = -1; // was +1 before
} else if (ax < -ACC_TILT_THRESHOLD) {
dy = 1; // was -1 before
}
if (dx != 0 || dy != 0) {
dotX = constrain(dotX + dx, 0, MATRIX_WIDTH - 1);
dotY = constrain(dotY + dy, 0, MATRIX_HEIGHT - 1);
lastMoveTime = now;
}
}
// -------- SETUP & LOOP --------
void setup() {
Serial.begin(115200);
delay(100);
// Matrix init
matrix.begin();
matrix.setBrightness(MATRIX_BRIGHTNESS);
matrix.fillScreen(0);
matrix.show();
// Buzzer init
pinMode(BUZZER_PIN, OUTPUT);
digitalWrite(BUZZER_PIN, LOW);
// IMU init
if (!imu.begin(11, 12)) {
Serial.println("Failed to initialize QMI8658!");
while (1) {
delay(100);
}
}
// Use m/s^2 and dps (optional, but nice)
imu.setAccelUnit_mps2(true);
imu.setGyroUnit_dps(true);
imu.setDisplayPrecision(3);
Serial.println("QMI8658 initialized.");
// Game initial state
randomSeed((uint32_t)micros());
dotX = MATRIX_WIDTH / 2;
dotY = MATRIX_HEIGHT / 2;
dotColor = matrix.Color(DOT_R, DOT_G, DOT_B);
circleColor = wheel(random(256));
drawScene();
}
void loop() {
// Read accelerometer
float ax, ay, az;
if (imu.readAccelMPS2(ax, ay, az)) {
// Debug if needed:
// Serial.print("AX: "); Serial.print(ax);
// Serial.print(" AY: "); Serial.print(ay);
// Serial.print(" AZ: "); Serial.println(az);
updateDotFromTilt(ax, ay);
}
// Check collision with circle
bool onCircle = isOnCircle(dotX, dotY);
if (onCircle && !wasOnCircle) {
// Just touched circle: change color + beep
circleColor = wheel(random(256));
buzzOnce();
}
wasOnCircle = onCircle;
// Redraw
drawScene();
// Small delay so we don’t hammer I2C too hard
delay(10);
}
Things you might need
-
Amazon
-
eBay
-
AliExpressPurchase ESP32-S3 RGB Matrix from AliExpresss.click.aliexpress.com
-
AliExpressPurchase ESP32-S3 RGB Matrix from AliExpress (2)s.click.aliexpress.com
Resources & references
-
Internal🎨 Color picker Toolrobojax.com
Files📁
Fritzing File
-
esp32-S3-supermini-tht fritzing part
esp32-S3-supermini-tht.fzpz0.02 MB