Dot game on the LED matrixTinkerPieCircuit tutorial 17 of 24 · Intermediate · 20 minutes

Use the two on-board buttons and the 6×5 LED matrix of the TinkerPie board to move a dot. No wires needed.

Open this circuit in TinkerPieCircuit (free, runs in your browser)

What you will learn

• The on-board buttons, matrix and buzzer
• Variables that remember a position
• Limiting a value with if

Parts

TinkerPie V1 board only

Steps

1. Know the board

   The board has 30 RGB LEDs in a 6×5 grid (x from 0 to 5, y from 0 to 4), buttons A and B, and a buzzer.

2. Store the position

   let x = 2; remembers which column the dot is in.

3. Move with buttons

   If buttonA() is pressed and x is more than 0, subtract 1. For buttonB() add 1, up to 5.

4. Draw

   matrixClear() then matrixSet(x, 2, 'red') draws the dot in the middle row.

5. Play

   Press ▶ Start and click the A and B buttons on the board picture. Each move beeps.

The code

let x = 2;

function setup() {
  matrixClear();
  matrixSet(x, 2, 'red');
}

function loop() {
  if (buttonA() && x > 0) {
    x = x - 1;
    tone(BUZZER, 660);
    delay(60);
    noTone(BUZZER);
    delay(120);
  }
  if (buttonB() && x < 5) {
    x = x + 1;
    tone(BUZZER, 880);
    delay(60);
    noTone(BUZZER);
    delay(120);
  }
  matrixClear();
  matrixSet(x, 2, 'red');
}

Copy this into the Code tab. It is Arduino-style JavaScript. The real board uses the same pin names (S1, P10…) in TinkerPie Studio.

How it works

The program draws a new picture again and again. Each time round the loop it clears the matrix and draws the dot at its latest position.

← Light alarm for a secret box · All 24 circuit tutorials · Distance meter with an ultrasonic sensor →