Touchscreen with 6 buttons for outputs

I used a 2.8" Elegoo touchscreen and Arduino Mega to control 6 relays.
The sketch contains extensive comments on its operation.
There are 6 pushbuttons to turn on outputs, and 6 to turn them off.
The attached photo shows what the screen looks like

No photo :wink:

sorry - I’m still trying how to figure out how to post the sketch

If you want to post a sketch. open it in the IDE and use edit → copy for forum. Next post it in a reply.

If you want to post an image, there are several ways.

  1. Click image above the reply textbox and follow instructions.
  2. Take a screenshot and paste it in the reply textbox; please don’t post screenshots of the full desktop as it can be quite big.
  3. Drag an image into the reply textbox.

[code]

/*

THIS SKETCH IS A MODIFIED (CHANGED) VERSION OF THE ORIGINAL ELEGOO 2.8" TFT TOUCHSCREEN Phonecal EXAMPLE SKETCH

THAT SKETCH IS FOUND IN THE EXAMPLES LIST ON THE CD ALONG WITH THE NECESSARY LIBRARIES

YOU WILL NEED TO INSTALL THE LIBRARIES IF YOU HAVE NOT ALREADY DONE SO

MOST OF THE ORIGINAL COMMENTS REMAIN, I DELETED SOME THAT WERE NO LONGER NEEDED

!! IT MIGHT BE NECESSARY TO LOAD THE ORIGINAL PHONECAL SKETCH TO CALIBRATE THE SCREEN - I’M NOT SURE !!

THIS POWER-UP SCREEN TOUCH SCREEN IS TOTALLY DIFFERENT

IT NOW FUNCTIONS TO CONTROL 6 OUTPUTS - SET HIGH OR LOW WITH A KEYBOARD BUTTON

THERE IS A ROW OF FILLED CIRCLES ACROSS THE TOP, IF THE CENTER IS RED, THAT OUTPUT IS OFF

A GREEN CENTER WILL REPRESENT THAT THE OUTPUT IS ON

THE TWO ROWS OF GREEN KEYS (1 TO 6) TURN ON INDIVIDUAL OUTPUTS

THE TWO ROWS OF RED KEYS (1 TO 6) TURN OFF THE INDIDVIDUAL OUTPUTS

THE DISPLAY IS PLUGGED DIRECTLY INTO A ARDUINO MEGA BOARD (REQUIRED)

I HAVE COMMENTED IN VARIOUS LINES OF THE SKETCH TO SHOW CHANGES MADE, ETC

SOME OF THE CODE CAN CERTAINLY BE CHANGED, MADE SIMPLER, BY SOMEONE WHO KNOWS HOW TO - - I’M STILL A NEWBY

PRIMARILY RELATING TO THE CHANGE FROM 15 TO 12 BUTTONS

PRESENTLY, THE KEY NUMBER (b = 3 ) REPRESENTS ACTUAL KEY #1 - - THAT WOULD CHANGE IF THE ABOVE CHANGES ARE MADE

I AM USING A RELAY BOARD FOR LOADS, IT HAS OPTICALLY ISOLATED INPUTS, AND THEY ARE “ACTIVE LOW”

MEANING A HIGH OUTPUT TURNS THEM OFF

1B74C9E61FE14127BDD4B1D8D839C6D7.png

A44C1D5C97B242E197D828211B5F2589.jpg

I do not know what happened to the sketch - here it is again

/*

  THIS SKETCH IS A MODIFIED (CHANGED) VERSION OF THE ORIGINAL ELEGOO 2.8" TFT TOUCHSCREEN Phonecal EXAMPLE SKETCH
  THAT SKETCH IS FOUND IN THE EXAMPLES LIST ON THE CD ALONG WITH THE NECESSARY LIBRARIES
  YOU WILL NEED TO INSTALL THE LIBRARIES IF YOU HAVE NOT ALREADY DONE SO
  MOST OF THE ORIGINAL COMMENTS REMAIN, I DELETED SOME THAT WERE NO LONGER NEEDED

  !! IT MIGHT BE NECESSARY TO LOAD THE ORIGINAL PHONECAL SKETCH TO CALIBRATE THE SCREEN - I'M NOT SURE !!

  THIS POWER-UP SCREEN TOUCH SCREEN IS TOTALLY DIFFERENT
  IT NOW FUNCTIONS TO CONTROL 6 OUTPUTS - SET HIGH OR LOW WITH A KEYBOARD BUTTON

  THERE IS A ROW OF FILLED CIRCLES ACROSS THE TOP, IF THE CENTER IS RED, THAT OUTPUT IS OFF
  A GREEN CENTER WILL REPRESENT THAT THE OUTPUT IS ON

  THE TWO ROWS OF GREEN KEYS (1 TO 6) TURN ON INDIVIDUAL OUTPUTS
  THE TWO ROWS OF RED KEYS (1 TO 6) TURN OFF THE INDIDVIDUAL OUTPUTS

  THE DISPLAY IS PLUGGED DIRECTLY INTO A ARDUINO MEGA BOARD (REQUIRED)
  I HAVE COMMENTED IN VARIOUS LINES OF THE SKETCH TO SHOW CHANGES MADE, ETC

  SOME OF THE CODE CAN CERTAINLY BE CHANGED, MADE SIMPLER, BY SOMEONE WHO KNOWS HOW TO - - I'M STILL A NEWBY
  PRIMARILY RELATING TO THE CHANGE FROM 15 TO 12 BUTTONS  
  PRESENTLY, THE KEY NUMBER (b = 3 )   REPRESENTS ACTUAL KEY #1  - - THAT WOULD CHANGE IF THE ABOVE CHANGES ARE MADE

  I AM USING A RELAY BOARD FOR LOADS, IT HAS OPTICALLY ISOLATED INPUTS, AND THEY ARE "ACTIVE LOW"
  MEANING A HIGH OUTPUT TURNS THEM OFF
   **************************************************************************************************************************************************
   THE DISPLAY AND RELAY BOARD ARE AVAILABLE FROM AMAZON (AND ELSEWHERE)  I CERTAINLY AM NOT ENDORSING AMAZON BUT THEIR PRICES ARE GOOD
   DESCRIPTION:
   ELEGOO UNO R3 2.8 Inches TFT Touch Screen with SD Card Socket w/All Technical Data in CD for Arduino UNO R3 ( $16.99 )
   FTCBlock 8 Channel DC 5V Relay Module with Optocoupler for Arduino UNO R3 MEGA 2560 ( $10.88 )
   *************************************************************************************************************************************************

  THE SMALL CIRCUIT BOARD SHOWN ON THE LEFT SIDE OF THE PICTURE WITH 4 PUSHBUTTONS AND 4 LEDS IS NOT USED HERE. 
  I USE IT FOR OTHER SKETCHES REQUIRING A MIX OF INPUTS AND OUTPUTS
  
*/

#include <Elegoo_GFX.h>    // Core graphics library+
#include <Elegoo_TFTLCD.h> // Hardware-specific library
#include <TouchScreen.h>
//*************************************************************************
//    THESE ARE THE OUTPUT PINS USED IN THIS SKETCH
//    THEY CONNECT TO PINS LABELED D1 TO D6 ON THE RELAY BOARD
//    5V AND GROUND ON THE RELAY BOARD CONNECT TO 5V AND GND ON THE MEGA
//************************************************************************

const int Load1 = 31;
const int Load2 = 33;
const int Load3 = 35;
const int Load4 = 37;
const int Load5 = 39;
const int Load6 = 41;


// The control pins for the LCD can be assigned to any digital or
// analog pins...but we'll use the analog pins as this allows us to
// double up the pins with the touch screen (see the TFT paint example).

#define LCD_CS A3 // Chip Select goes to Analog 3
#define LCD_CD A2 // Command/Data goes to Analog 2
#define LCD_WR A1 // LCD Write goes to Analog 1
#define LCD_RD A0 // LCD Read goes to Analog 0

#define LCD_RESET A4 // Can alternately just connect to Arduino's reset pin

// Assign human-readable names to some common 16-bit color values:
#define	BLACK   0x0000
#define	BLUE    0x001F
#define	RED     0xF800
#define	GREEN   0x07E0
#define CYAN    0x07FF
#define MAGENTA 0xF81F
#define YELLOW  0xFFE0
#define WHITE   0xFFFF
#define DARKGREEN 0x03E0
#define GREENYELLOW 0xAFE5

// Color definitions
#define ILI9341_BLACK       0x0000      /*   0,   0,   0 */
#define ILI9341_NAVY        0x000F      /*   0,   0, 128 */
#define ILI9341_DARKGREEN   0x03E0      /*   0, 128,   0 */
#define ILI9341_DARKCYAN    0x03EF      /*   0, 128, 128 */
#define ILI9341_MAROON      0x7800      /* 128,   0,   0 */
#define ILI9341_PURPLE      0x780F      /* 128,   0, 128 */
#define ILI9341_OLIVE       0x7BE0      /* 128, 128,   0 */
#define ILI9341_LIGHTGREY   0xC618      /* 192, 192, 192 */
#define ILI9341_DARKGREY    0x7BEF      /* 128, 128, 128 */
#define ILI9341_BLUE        0x001F      /*   0,   0, 255 */
#define ILI9341_GREEN       0x07E0      /*   0, 255,   0 */
#define ILI9341_CYAN        0x07FF      /*   0, 255, 255 */
#define ILI9341_RED         0xF800      /* 255,   0,   0 */
#define ILI9341_MAGENTA     0xF81F      /* 255,   0, 255 */
#define ILI9341_YELLOW      0xFFE0      /* 255, 255,   0 */
#define ILI9341_WHITE       0xFFFF      /* 255, 255, 255 */
#define ILI9341_ORANGE      0xFD20      /* 255, 165,   0 */
#define ILI9341_GREENYELLOW 0xAFE5      /* 173, 255,  47 */
#define ILI9341_PINK        0xF81F

#define BUTTON_X 40
#define BUTTON_Y 100
#define BUTTON_W 60
#define BUTTON_H 30
#define BUTTON_SPACING_X 20
#define BUTTON_SPACING_Y 20
#define BUTTON_TEXTSIZE 2

// THESE VALUES ARE USED IN LINE 203, THEY COULD BE LODAED DIECTLY THERE AND ELIMINATE THIS

#define TEXT_X 10
#define TEXT_Y 10
#define TEXT_W 220
#define TEXT_H 115
#define TEXT_TSIZE 3


#define TEXT_LEN 12
char textfield[TEXT_LEN + 1] = "";
uint8_t textfield_i = 0;

#define YP A3  // must be an analog pin, use "An" notation!
#define XM A2  // must be an analog pin, use "An" notation!
#define YM 9   // can be a digital pin
#define XP 8   // can be a digital pin

//Touch For New ILI9341 TP
#define TS_MINX 120
#define TS_MAXX 900

#define TS_MINY 70
#define TS_MAXY 920

Elegoo_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);
TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);

Elegoo_GFX_Button buttons[15];

// NOW ONLY 12 BUTTONS ARE DISPLAYED, 6 GREEN TO SET OUTPUT HIGH, 6 RED TO RESET TO LOW.
//BUTTONS 0,1,AND 2 ("SEND", "CLR", AND "END") HAVE BEEN REPLACED WITH EMPTY SPACES
// ALL BUTTONS HAVE BEEN RE-NUMBERED (6 GREEN T0 TURN ON, 6 RED TO TURN OFF)

// I AM USING A RELAY BOARD FOR LOADS - IT IS "ACTIVE LOW", MENAING THAT WHEN THE LOAD PIN IS "LOW", THE RELAY ENERGIZES
// A "HIGH" OUTPUT DE-ENERGIZES THE LOAD
// ALL OF THE HIGH AND LOW STATEMENTS WOULD HAVE TO BE REVERSED FOR "NORMAL USE", LIKE A NORMAL RELAY OR LED, ETC

char buttonlabels[15][5] = {" ", " ", " ", "1", "2", "3", "4", "5", "6", "1", "2", "3", "4", "5", "6" };
//  15 SPACES STILL NEEDED, EVEN THOUGH ONLY 12 ARE DISPLAYED

uint16_t buttoncolors[15] = {ILI9341_DARKGREEN, ILI9341_DARKGREY, ILI9341_RED, // THESE THREE BUTTONS NO LONGER EXIST

                             ILI9341_GREENYELLOW, ILI9341_GREENYELLOW, ILI9341_GREENYELLOW,
                             ILI9341_GREENYELLOW, ILI9341_GREENYELLOW, ILI9341_GREENYELLOW,
                             ILI9341_RED, ILI9341_RED, ILI9341_RED,
                             ILI9341_RED, ILI9341_RED, ILI9341_RED
                            };

void setup(void) {

  //OUTPUTS USED ARE 31,33,35,37,39,41

  pinMode (Load1, OUTPUT);
  pinMode (Load2, OUTPUT);
  pinMode (Load3, OUTPUT);
  pinMode (Load4, OUTPUT);
  pinMode (Load5, OUTPUT);
  pinMode (Load6, OUTPUT);

  //**********************************
  // THIS WOULD NEED TO BE REVERSED FOR "NORMAL" OUTPUTS
  //INITALIZE ALL RELAYS OFF (HIGH OUTPUTS - -

  digitalWrite (Load1, HIGH);
  digitalWrite (Load2, HIGH);
  digitalWrite (Load3, HIGH);
  digitalWrite (Load4, HIGH);
  digitalWrite (Load5, HIGH);
  digitalWrite (Load6, HIGH);

  //**************************************

  Serial.begin(9600);
  Serial.println(F("TFT LCD test"));

#ifdef USE_Elegoo_SHIELD_PINOUT

  Serial.println(F("Using Elegoo 2.8\" TFT Breakout Board Pinout"));
#endif

  Serial.print("TFT size is "); Serial.print(tft.width()); Serial.print("x"); Serial.println(tft.height());

  tft.reset();

  uint16_t identifier = tft.readID();
  identifier = 0x9341;
  Serial.println(F("Found 0x9341 LCD driver"));

  tft.begin(identifier);
  tft.setRotation(2);
  tft.fillScreen(BLACK);

  // create buttons
  for (uint8_t row = 1; row < 5; row++) {
    for (uint8_t col = 0; col < 3; col++) {
      buttons[col + row * 3].initButton(&tft, BUTTON_X + col * (BUTTON_W + BUTTON_SPACING_X),
                                        BUTTON_Y + row * (BUTTON_H + BUTTON_SPACING_Y), // x, y, w, h, outline, fill, text
                                        BUTTON_W, BUTTON_H, ILI9341_WHITE, buttoncolors[col + row * 3], ILI9341_BLACK,
                                        buttonlabels[col + row * 3], BUTTON_TEXTSIZE);
      buttons[col + row * 3].drawButton();
    }
  }


  tft.fillRect(TEXT_X, TEXT_Y, TEXT_W, TEXT_H, ILI9341_WHITE);// DRAW THE BOX ON TOP

  // DISPLAY THE 6 SMALL FILLED CIRCLES ACROSS THE TOP, LARGE BLACK THEN SMALLER RED

  tft.fillCircle(35, 30, 12, BLACK);
  tft.fillCircle(70, 30, 12, BLACK);
  tft.fillCircle(105, 30, 12, BLACK);
  tft.fillCircle(140, 30, 12, BLACK);
  tft.fillCircle(175, 30, 12, BLACK);
  tft.fillCircle(210, 30, 12, BLACK);


  tft.fillCircle(35, 30, 8, RED);
  tft.fillCircle(70, 30, 8, RED);
  tft.fillCircle(105, 30, 8, RED);
  tft.fillCircle(140, 30, 8, RED);
  tft.fillCircle(175, 30, 8, RED);
  tft.fillCircle(210, 30, 8, RED);


  tft.setTextColor(BLACK);
  tft.setTextSize(3);
  tft.setCursor(32, 57);
  tft.println("GREEN = ON");
  tft.setCursor(44, 90);
  tft.println("RED = OFF");

}

#define MINPRESSURE 10
#define MAXPRESSURE 1000
void loop(void) {

  digitalWrite(13, HIGH);
  TSPoint p = ts.getPoint();
  digitalWrite(13, LOW);

  // if sharing pins, you'll need to fix the directions of the touchscreen pins
  //pinMode(XP, OUTPUT);
  pinMode(XM, OUTPUT);
  pinMode(YP, OUTPUT);
  //pinMode(YM, OUTPUT);

  // we have some minimum pressure we consider 'valid'
  // pressure of 0 means no pressing!
  // Scale from ~0->4000 to tft.width using the calibration #'s

  if (p.z > MINPRESSURE && p.z < MAXPRESSURE) {
    // scale from 0->1023 to tft.width
    p.x = map(p.x, TS_MINX, TS_MAXX, tft.width(), 0);
    p.y = (tft.height() - map(p.y, TS_MINY, TS_MAXY, tft.height(), 0));
  }

  // go thru all the buttons, checking if they were pressed
  for (uint8_t b = 1; b < 15; b++) {
    if (buttons[b].contains(p.x, p.y)) {
      //Serial.print("Pressing: "); Serial.println(b);
      buttons[b].press(true);  // tell the button it is pressed
    } else {
      buttons[b].press(false);  // tell the button it is NOT pressed
    }
  }

  // now we can ask the buttons if their state has changed
  for (uint8_t b = 1; b < 15; b++) {
    if (buttons[b].justReleased()) {
      // Serial.print("Released: "); Serial.println(b);
      buttons[b].drawButton();  // draw normal
    }

    if (buttons[b].justPressed()) {
      buttons[b].drawButton(true);  // draw invert!

      // if a numberpad button, append the relevant # to the textfield
      if (b >= 3) {
        if (textfield_i < TEXT_LEN) {
          textfield[textfield_i] = buttonlabels[b][0];
          textfield_i++;
          textfield[textfield_i] = 0; // zero terminate

        }

      }

      //****************************************************
      //    THE STATUS HAS BEEN REVERSED HERE TO WORK WITH 6 RELAYS THAT ENERGIZE LOW
      //    THE MEGA OUTPUTS ARE INITALIZED HIGH IN THIS CASE
      //    FOR A NORMAL LOAD, THEY WOULD HAVE TO BE INITIALIZED LOW
      //    THE LOW/HIGH CODE BELOW WOULD ALSO CHANGE TO HIGH/LOW
      //    KEYS 0,1, AND 2 NO LONGER EXIST, THEREFORE WE START AT 3
      
      //    CHECK FOR A BUTTON CLOSURE, TURN THE APPROPRIATE LOAD ON OR OFF, 
      //    AND CHANGE THE COLOR OF THE INNER CIRCLE ACROSS THE TOP  
      //****************************************************

      if (b == 3 )  {  //THIS IS NUMBER ONE KEY
        digitalWrite (Load1, LOW);

        tft.fillCircle(35, 30, 8, GREENYELLOW);
      }

      if (b == 9 )
      { digitalWrite (Load1, HIGH);

        tft.fillCircle(35, 30, 8, RED);

      }

      if (b == 4 )  {  //THIS IS NUMBER TWO KEY
        digitalWrite (Load2, LOW);
        tft.fillCircle(70, 30, 8, GREENYELLOW);
      }

      if (b == 10 )
      { digitalWrite (Load2, HIGH);
        tft.fillCircle(70, 30, 8, RED);

      }


      if (b == 5 )  {  //THIS IS NUMBER THREE KEY
        digitalWrite (Load3, LOW);
        tft.fillCircle(105, 30, 8, GREENYELLOW);
      }

      if (b == 11 )
      { digitalWrite (Load3, HIGH);
        tft.fillCircle(105, 30, 8, RED);

      }

      if (b == 6 )  {  //THIS IS NUMBER FOUR KEY
        digitalWrite (Load4, LOW);
        tft.fillCircle(140, 30, 8, GREENYELLOW);
      }

      if (b == 12 )
      { digitalWrite (Load4, HIGH);
        tft.fillCircle(140, 30, 8, RED);

      }


      if (b == 7 )  { //THIS IS NUMBER FIVE KEY
        digitalWrite (Load5, LOW);
        tft.fillCircle(175, 30, 8, GREENYELLOW);
      }

      if (b == 13 )
      { digitalWrite (Load5, HIGH);
        tft.fillCircle(175, 30, 8, RED);

      }

      if (b == 8 )  { //THIS IS NUMBER SIX KEY
        digitalWrite (Load6, LOW);
        tft.fillCircle(210, 30, 8, GREENYELLOW);
      }

      if (b == 14 )
      { digitalWrite (Load6, HIGH);
        tft.fillCircle(210, 30, 8, RED);

      }

      delay(200); //  debouncing changed from 100
    }
  }

}

Looks neat.

Pls guys im starting in this word and i need help, i need something like this menu, i little bit more difficult, can you help me? i need for highschool

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