Tic-tac-toe Game Based on Arduino and HMI

Community Exhibition / Gallery
1

I think it's fun and not boring to get familiar with a new product by making games, and that's exactly why I did this project.
This project is to use Arduino UNO and Stone tft lcd display to develop a simple tic-tac-toe game.

Materials required for the experiment

Arduino UNO

Stone STWI070WT-01 tft lcd display

The system principle

Specify the first tap on the screen must be O, the second tap on the screen is X, has been doing this cycle. Set 8 arrays to store the number of O and X in each row, column and diagonal of each grid, as long as there are three of the same mark is the victory, then there will be a flashing red box to prove the victory of the row, column or diagonal, and then tap reset to start the game again.

Simple connection diagram

QQ图片20210630113111
QQ图片202106301131114032×3024 2.33 MB

1 Like
2

GUI design

图片1
图片11600×868 121 KB

3

Before I put the code, I really need to thank everyone on the forum for fixing my uploading error.
https://forum.arduino.cc/t/data-section-exceeds-available-space-in-board/873305
After solving that problem, my code was uploaded to the UNO board without any problems, which finally allowed me to implement my project. Thanks to everyone who helped me!

unsigned int r_flag1 = 0;
uint8_t   RecievedTemp1[30]       = {0};
//uint8_t   *RecievedTemp1 = new uint8_t[30];
uint8_t   cout_i = 0;
unsigned int quan_hang1 = 0;
unsigned int quan_hang2 = 0;
unsigned int quan_hang3 = 0;
unsigned int quan_lie1 = 0;
unsigned int quan_lie2 = 0;
unsigned int quan_lie3 = 0;
unsigned int quan_zuoxia = 0;
unsigned int quan_youxia = 0;

//unsigned int quan[8]={0};
//
unsigned int cha_hang1 = 0;
unsigned int cha_hang2 = 0;
unsigned int cha_hang3 = 0;
unsigned int cha_lie1 = 0;
unsigned int cha_lie2 = 0;
unsigned int cha_lie3 = 0;
unsigned int cha_zuoxia = 0;
unsigned int cha_youxia = 0;
unsigned int cha[8]={0};
void setup()
{
   Serial.begin(115200);
   for(int i=3; i<=8; i++) 
   pinMode(i,OUTPUT);
}

void loop(){

  if(Serial.available() != 0)
  {
//    for(cout_i = 0; cout_i < 30; cout_i ++)
//    {
//        //RecievedTemp1[cout_i] = Serial.readBytes(RecievedTemp1, 15);
//        Serial.readBytes(RecievedTemp1, 20);
//        //Serial.println(RecievedTemp1[cout_i]);
//    }
    Serial.readBytes(RecievedTemp1, 20);
    for(cout_i = 0; cout_i < 19; cout_i ++)
    {
    Serial.println(RecievedTemp1[cout_i]);
    }
    switch(RecievedTemp1[13])
  {
  case 49:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image2\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang1++;
        quan_lie1++;
        quan_youxia++;
//        quan[0]++;
//        quan[3]++;
//        quan[7]++;
        Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button1\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image2\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
            cha_hang1++;
            cha_lie1++;
            cha_youxia++;
//        cha[0]++;
//        cha[3]++;
//        cha[7]++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button1\",\"enable\":false}>ET"));
        }
        
        break;
  case 50:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image3\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang1++;
            quan_lie2++;
//        quan[0]++;
//        quan[4]++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button2\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image3\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang1++;
           cha_lie2++;
//        cha[0]++;
//        cha[4]++;
           Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button2\",\"enable\":false}>ET"));
        }
        break;
  case 51:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image4\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang1++;
            quan_lie3++;
            quan_zuoxia++;
//        quan[0]++;
//        quan[5]++;
//        quan[6]++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button3\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image4\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang1++;
           cha_lie3++;
            cha_zuoxia++;
//        cha[0]++;
//        cha[5]++;
//        cha[6]++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button3\",\"enable\":false}>ET"));
        }
        break;
  case 52:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image5\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang2++;
            quan_lie1++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button4\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image5\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang2++;
           cha_lie1++;
           Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button4\",\"enable\":false}>ET"));
        }
        break;
  case 53:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image6\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang2++;
            quan_lie2++;
            quan_zuoxia++;
            quan_youxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button5\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image6\",\"image\":\"x\"}>ET"));
          r_flag1 = 0;
          cha_hang2++;
            cha_lie2++;
            cha_zuoxia++;
            cha_youxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button5\",\"enable\":false}>ET"));
        }
        break;       
  case 54:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image7\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang2++;
            quan_lie3++;
//        quan[1]++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button6\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image7\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang2++;
           cha_lie3++;
           Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button6\",\"enable\":false}>ET"));
        }
        break;       
  case 55:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image8\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang3++;
            quan_lie1++;
            quan_zuoxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button7\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image8\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang3++;
           cha_lie1++;
            cha_zuoxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button7\",\"enable\":false}>ET"));
        }
        break;        
  case 56:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image9\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang3++;
            quan_lie2++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button8\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image9\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang3++;
           cha_lie2++;
           Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button8\",\"enable\":false}>ET"));
        }
        break;       
  case 57:
        if((r_flag1 == 0)&&(RecievedTemp1[14]==2))
        {
        Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image10\",\"image\":\"circle\"}>ET"));
        r_flag1 = 1;
        quan_hang3++;
            quan_lie3++;
            quan_youxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button9\",\"enable\":false}>ET"));
        }
        else if((r_flag1 == 1)&&(RecievedTemp1[14]==2))
        {
          Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image10\",\"image\":\"x\"}>ET"));
         r_flag1 = 0;
         cha_hang3++;
           cha_lie3++;
            cha_youxia++;
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button9\",\"enable\":false}>ET"));
        }
        break;
  case 48:
            r_flag1 = 0;
            quan_hang1=quan_hang2=quan_hang3=cha_hang1=cha_hang2=cha_hang3=0;
            quan_lie1=quan_lie2=quan_lie3=cha_lie1=cha_lie2=cha_lie3=0;
            quan_zuoxia=quan_youxia=cha_zuoxia=cha_youxia=0;
//            for(char count_i=50;count_i<58;count_i++)
//            {
//              Serial.println((("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image%c\",\"image\":\"bai\"}>ET"),count_i));
//              }
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image2\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image3\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image4\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image5\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image6\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image7\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image8\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image9\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_image\",\"type\":\"image\",\"widget\":\"image10\",\"image\":\"bai\"}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif4\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif5\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif6\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif7\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif8\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif9\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif10\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif11\",\"visible\":false}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button9\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button8\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button7\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button6\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button5\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button4\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button3\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button2\",\"enable\":true}>ET"));
            Serial.println(F("ST<{\"cmd_code\":\"set_enable\",\"type\":\"widget\",\"widget\":\"button1\",\"enable\":true}>ET"));
            
            break;
  }
  if((quan_hang1==3)||(cha_hang1==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif4\",\"visible\":true}>ET"));
      }
      else if((quan_hang2==3)||(cha_hang2==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif5\",\"visible\":true}>ET"));
      }
      else if((quan_hang3==3)||(cha_hang3==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif6\",\"visible\":true}>ET"));
      }
      else if((quan_lie1==3)||(cha_lie1==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif7\",\"visible\":true}>ET"));
      }
      else if((quan_lie2==3)||(cha_lie2==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif8\",\"visible\":true}>ET"));
      }
      else if((quan_lie3==3)||(cha_lie3==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif9\",\"visible\":true}>ET"));
      }
      else if((quan_zuoxia==3)||(cha_zuoxia==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif11\",\"visible\":true}>ET"));
      }
      else if((quan_youxia==3)||(cha_youxia==3))
      {
            Serial.println(F("ST<{\"cmd_code\":\"set_visible\",\"type\":\"widget\",\"widget\":\"gif10\",\"visible\":true}>ET"));
      }
  }
}
4

A demo video of the project will be attached here.
https://www.youtube.com/watch?v=inMMf5RX6Xs

5

Hey dude, you really made a great project!

6

Very well done :white_check_mark:
I can't wait to see what other games you can put together.

7

Very nice! :heart_eyes:

8

Big up from all tic tac toe fans, the best time killer of all time :laughing:

9

This topic was automatically closed 120 days after the last reply. New replies are no longer allowed.