In this tutorial we are going to see how to make your own Arduino Dice Roller with TFT 2.4 Inch Display (MCUFriend), which will show random numbers from 1 to 6 every time you press play button. So let’s get started.

Components Required:
  1. Arduino Uno,
  2. TFT Display 2.4 Inch.
Required Libraries:
  1. mcufriend_kbv
  2. Adafruit_GFX
  3. Dependencies Libraries (Touchscreen etc)

Open Arduino IDE. Go to Sketches > include library > Manage Libraries > Type library name > install

Installing Adafruit_GFX dependencies libraries

Know more about how to add library in Arduino IDE.

Calibrating Touch Screen:

Open touch screen calibration code & upload it.

Go to Files → Examples → MCUFRIEND_kbv → TouchScreen_Calibr_native

Follow screen instruction and touch & hold as near as possible to the mark and then release.

Calibrating Touch Screen

After pressing all the mark, you will get the result on screen as well as on serial monitor and I suggest you to open serial monitor, before starting calibration.

Calibration value of TFT display

Edit this part of code to your screen calibration.

const int TS_LEFT = 772, TS_RT = 138, TS_TOP = 869, TS_BOT = 236;
Displaying Text on TFT Display:

showmsgXY(x, y, font size, font, msg);

showmsgXY(20, 60, 2, NULL, "Game Rule: ");

Displaying Text on TFT Screen

Our screen resolution is 240X320. X= 20, Y= 60 where text will start writing and 2 is a size of font. We are not using any font type so it is NULL. Next argument is “Text”. We are passing this argument to the function.

void showmsgXY(int x, int y, int sz, const GFXfont *f, const char *msg)
{
int16_t x1, y1;
uint16_t wid, ht;
//tft.drawFastHLine(0, y, tft.width(), WHITE);
tft.setFont(f);
tft.setCursor(x, y);
tft.setTextColor(GREEN);
tft.setTextSize(sz);
tft.print(msg);
delay(400);
}
Drawing Square or Rectangle on TFT Display:

tft.fillRect(x, y, w, h, color);

tft.fillRect(30, 50, 70, 70, RED);

X= 30, Y = 50 where Rectangle or square will appear. (X,Y) is square’s left most upper corner location.

Width = 70, Height = 70.

Square color filled with RED, Obviously you can change that color.

drawing rectangle on TFT Screen

Adding A Button to TFT Display for Dice Play:

play_btn.initButton(&tft, x, y, w, h, border line color, button color, text color, “Text”, font size);

play_btn.initButton(&tft, 120, 290, 240, 50, WHITE, CYAN, BLACK, "PLAY!!!", 3);

X= 120, Y =290, But its location is different then rectangle or text, it will not start from left most upper corner, (X,Y) is a center location of button. Width & Height is 240 & 50 respectively. You can also set colors for border line, button inside color & text color. Next Argument is text, which we want to present inside the button, i.e PLAY and its font size is 3.

Adding Button on TFT Screen

Generating Random Number for Arduino Dice:
randomSeed(analogRead(5));

random analog noise will cause the call to randomSeed() to generate different seed numbers each time the sketch runs. randomSeed() will then shuffle the random function.

randNumber = random(1, 7);

Generate random numbers between 1 to 6.

Screen portrait or landscape Mode:

you can change screen orientation just by giving angle.

tft.setRotation(0); // for portrait

if you want landscape mode then change angle to 90.

tft.setRotation(90); // for landscape

Similarly you can change the angle, if it looks upside down.

Getting Errors:

You may get errors while uploading the code, the main cause of getting error is, your LCD is connected to Arduino. So make sure you remove LCD from arduino and after uploading the code you can place LCD on Arduino. If you are still getting the errors, unplug the USB and then again plug the cable.

Arduino Dice Roller with TFT Display Code:
//RoboticaDIY.com

#if 1

#include <Adafruit_GFX.h>
#include <MCUFRIEND_kbv.h>
MCUFRIEND_kbv tft;
#include <TouchScreen.h>
#define MINPRESSURE 200
#define MAXPRESSURE 1000
#include <FreeDefaultFonts.h>
#include <Fonts/FreeSans12pt7b.h>
int randNumber;
int activate =0;
// ALL Touch panels and wiring is DIFFERENT
// copy-paste results from TouchScreen_Calibr_native.ino
const int XP = 6, XM = A2, YP = A1, YM = 7; //ID=0x9341
const int TS_LEFT = 772, TS_RT = 138, TS_TOP = 869, TS_BOT = 236;

TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);

Adafruit_GFX_Button play_btn;

int pixel_x, pixel_y; //Touch_getXY() updates global vars
bool Touch_getXY(void)
{
TSPoint p = ts.getPoint();
pinMode(YP, OUTPUT); //restore shared pins
pinMode(XM, OUTPUT);
digitalWrite(YP, HIGH); //because TFT control pins
digitalWrite(XM, HIGH);
bool pressed = (p.z > MINPRESSURE && p.z < MAXPRESSURE);
if (pressed) {
pixel_x = map(p.x, TS_LEFT, TS_RT, 0, tft.width()); //.kbv makes sense to me
pixel_y = map(p.y, TS_TOP, TS_BOT, 0, tft.height());
}
return pressed;
}

#define BLACK 0x0000
#define BLUE 0x001F
#define RED 0xF800
#define GREEN 0x07E0
#define CYAN 0x07FF
#define MAGENTA 0xF81F
#define YELLOW 0xFFE0
#define WHITE 0xFFFF

void setup(void)
{
Serial.begin(9600);
uint16_t ID = tft.readID();
Serial.print("TFT ID = 0x");
Serial.println(ID, HEX);
Serial.println("Calibrate for your Touch Panel");
if (ID == 0xD3D3) ID = 0x9486; // write-only shield
tft.begin(ID);
tft.setRotation(0); //PORTRAIT
tft.fillScreen(BLACK);
play_btn.initButton(&tft, 120, 290, 240, 50, WHITE, CYAN, BLACK, "PLAY!!!", 3);
play_btn.drawButton(false);

showmsgXY(20, 20, 2, NULL, "RoboticaDIY.com");
showmsgXY(20, 60, 2, NULL, "Game Rule: ");
showmsgXY(20, 90, 2, NULL, "1)Hit the play");
showmsgXY(20, 110, 2, NULL, " button.");
showmsgXY(20, 140, 2, NULL, "2)Wait until it");
showmsgXY(20, 160, 2, NULL, " picks the random");
showmsgXY(20, 180, 2, NULL, " number.");
showmsgXY(20, 210, 2, NULL, "3)Hit Play Again.");

randomSeed(analogRead(5));
}


void loop(void)
{
bool down = Touch_getXY();
play_btn.press(down && play_btn.contains(pixel_x, pixel_y));

if (play_btn.justReleased())
play_btn.drawButton();

if (play_btn.justPressed()) {
//play_btn.drawButton(true);
randNumber = random(1, 7);
activate = 1;
tft.fillScreen(YELLOW);
tft.fillRect(30, 50, 70, 70, RED);
tft.fillRect(140, 50, 70, 70, RED);
tft.fillRect(30, 170, 70, 70, RED);
tft.fillRect(140, 170, 70, 70, RED);
delay(200);
tft.fillScreen(MAGENTA);
tft.fillRect(85, 120, 70, 70, RED);
delay(200);
tft.fillScreen(BLUE);
tft.fillRect(30, 10, 70, 70, RED);
tft.fillRect(130, 10, 70, 70, RED);
tft.fillRect(30, 90, 70, 70, RED);
tft.fillRect(130, 90, 70, 70, RED);
tft.fillRect(30, 170, 70, 70, RED);
tft.fillRect(130, 170, 70, 70, RED);
delay(200);
tft.fillScreen(WHITE);
tft.fillRect(140, 30, 70, 70, RED);
tft.fillRect(30, 140, 70, 70, RED);
delay(200);
tft.fillScreen(CYAN);
tft.fillRect(10, 10, 70, 70, RED);
tft.fillRect(160, 10, 70, 70, RED);
tft.fillRect(85, 85, 70, 70, RED);
tft.fillRect(10, 160, 70, 70, RED);
tft.fillRect(160, 160, 70, 70, RED);
delay(200);
tft.fillScreen(GREEN);
tft.fillRect(10, 170, 70, 70, RED);
tft.fillRect(85, 90, 70, 70, RED);
tft.fillRect(160, 10, 70, 70, RED);
delay(200);

}


Serial.println(randNumber);
if (activate == 1){

switch (randNumber) {
case 1: 
tft.fillScreen(BLACK);
tft.fillRect(85, 120, 70, 70, RED);
activate = 0;
break;
case 2: 
tft.fillScreen(BLACK);
tft.fillRect(140, 30, 70, 70, RED);
tft.fillRect(30, 140, 70, 70, RED);
activate = 0;
break;
case 3: 
tft.fillScreen(BLACK);
tft.fillRect(10, 170, 70, 70, RED);
tft.fillRect(85, 90, 70, 70, RED);
tft.fillRect(160, 10, 70, 70, RED);
activate = 0;
break;
case 4: 
tft.fillScreen(BLACK);
tft.fillRect(30, 50, 70, 70, RED);
tft.fillRect(140, 50, 70, 70, RED);
tft.fillRect(30, 170, 70, 70, RED);
tft.fillRect(140, 170, 70, 70, RED);
activate = 0;
break;
case 5: 
tft.fillScreen(BLACK);
tft.fillRect(10, 10, 70, 70, RED);
tft.fillRect(160, 10, 70, 70, RED);
tft.fillRect(85, 85, 70, 70, RED);
tft.fillRect(10, 160, 70, 70, RED);
tft.fillRect(160, 160, 70, 70, RED);
activate = 0;
break;
case 6: 
tft.fillScreen(BLACK);
tft.fillRect(30, 10, 70, 70, RED);
tft.fillRect(130, 10, 70, 70, RED);
tft.fillRect(30, 90, 70, 70, RED);
tft.fillRect(130, 90, 70, 70, RED);
tft.fillRect(30, 170, 70, 70, RED);
tft.fillRect(130, 170, 70, 70, RED);
activate = 0;
break;

}
}


}
#endif

void showmsgXY(int x, int y, int sz, const GFXfont *f, const char *msg)
{
int16_t x1, y1;
uint16_t wid, ht;
//tft.drawFastHLine(0, y, tft.width(), WHITE);
tft.setFont(f);
tft.setCursor(x, y);
tft.setTextColor(GREEN);
tft.setTextSize(sz);
tft.print(msg);
delay(400);
}
Video:

If you liked this project, Please Like & Subcribe to my YouTube Channel.