0

drawing a button and controlling a relay
Moderators: adafruit_support_bill, adafruit

Please be positive and constructive with your questions and comments.

drawing a button and controlling a relay

by everone on Wed Jan 16, 2019 6:30 pm

hello iam trying to control different analog and digital pins by use of the example code "on-off button".
I don't see how to control anything other then the color of the button itself. how can I make the button say turn on an led?

everone
 
Posts: 29
Joined: Tue Mar 29, 2016 1:23 am

Re: drawing a button and controlling a relay

by franklin97355 on Wed Jan 16, 2019 6:35 pm

What are you working with? Which shields are you trying to use and where did you get the example code?

franklin97355
 
Posts: 20131
Joined: Mon Apr 21, 2008 2:33 pm
Location: Lacomb, OR.

Re: drawing a button and controlling a relay

by everone on Wed Jan 16, 2019 6:55 pm

Sorry,

im utilizing

Arduino.cc Mega 2560 R3
Adafruit.com captouch 2.8" tft

my code looks like this
Code: Select all | TOGGLE FULL SIZE
*  Im using double in this sketch to gain more precition
 */
//
#include "SPI.h"
#include "Adafruit_GFX.h"
#include "Adafruit_ILI9341.h"

// For the Adafruit shield, these are the default.
#define TFT_DC 9
#define TFT_CS 10

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

// Use hardware SPI (on Uno, #13, #12, #11) and the above for CS/DC
Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC);
// If using the breakout, change pins as desired
//Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC, TFT_MOSI, TFT_CLK, TFT_RST, TFT_MISO);

void setup() {

  // Begin Serial Comm
  Serial.begin(9600);
  Serial.println("ILI9341 Test!");

  //Begin TFT
  tft.begin();

  // Read diagnostics (optional but can help debug problems)
  uint8_t x = tft.readcommand8(ILI9341_RDMODE);
  Serial.print("Display Power Mode: 0x"); Serial.println(x, HEX);
  x = tft.readcommand8(ILI9341_RDMADCTL);
  Serial.print("MADCTL Mode: 0x"); Serial.println(x, HEX);
  x = tft.readcommand8(ILI9341_RDPIXFMT);
  Serial.print("Pixel Format: 0x"); Serial.println(x, HEX);
  x = tft.readcommand8(ILI9341_RDIMGFMT);
  Serial.print("Image Format: 0x"); Serial.println(x, HEX);
  x = tft.readcommand8(ILI9341_RDSELFDIAG);
  Serial.print("Self Diagnostic: 0x"); Serial.println(x, HEX);


  //set screen rotation
  tft.setRotation(1);
 
  //fill screen black
  tft.fillScreen(BLACK);
 
  //set text wrap
  tft.setTextWrap(true);

  // Display text
  tft.setCursor(0, 0);
  tft.setTextColor(WHITE);
  tft.setTextSize(1);
  tft.println("Hello World!");

  tft.setTextColor(RED);
  tft.setTextSize(2);
  tft.println("Welcome to the first");

  tft.setTextColor(GREEN);
  tft.setTextSize(3);
  tft.println("Version of our Watering");

  tft.setTextColor(BLUE);
  tft.setTextSize(4);
  tft.println("System");

  delay(4000);
 
  tft.fillScreen(BLACK);
 
}

// the loop routine runs over and over again forever:
void loop() {
  // read the input on analog pin 10:
   double sensorValue = analogRead(A10);     //get current sensorValue between 0-1000
   double Voltage = sensorValue*(5.0/1024.0);     //convert sensorValue to voltage 0-5v
   double pH = (Voltage*3.56)-1.889;     //convert voltage to pH
  // print out the value you read:
  Serial.println("SensorValue");
  Serial.println(sensorValue);
  Serial.println("Voltage");
  Serial.println(Voltage);
  Serial.println("pH");
  Serial.println(pH);

  tft.setCursor(1,0);
  tft.setTextSize(3);
  tft.setTextColor(WHITE);
  tft.println("GrayMatter");
  tft.setCursor(25,25);
  tft.println("Growers");
 
 
  tft.drawRoundRect(210,10,90,45,25,WHITE);
  tft.setCursor(230,15);
  tft.setTextSize(2);
  tft.setTextColor(WHITE);
  tft.println("pH =");
  tft.setCursor(230,33);
  tft.println(pH); // print pH value 0-14

  tft.drawRoundRect(210,65,90,45,25,WHITE);
  tft.setCursor(230,70);
  tft.setTextSize(2);
  tft.setTextColor(WHITE);
  tft.println("Temp");
  tft.setCursor(230,88);
  tft.println("87f"); // print temp value F

  tft.drawRoundRect(210,120,90,45,25,WHITE);
  tft.setCursor(230,125);
  tft.setTextSize(2);
  tft.setTextColor(WHITE);
  tft.println("Hum =");
  tft.setCursor(230,143);
  tft.println("75%"); // print Humidity value %

  tft.drawRoundRect(210,175,90,45,25,WHITE);
  tft.setCursor(230,180);
  tft.setTextSize(2);
  tft.setTextColor(WHITE);
  tft.println("cO2 =");
  tft.setCursor(230,198);
  tft.println(pH); // print cO2 value ppm
  delay(10000);        // delay in between reads for stability
 
  tft.fillScreen(BLACK);
 
}
Last edited by franklin97355 on Wed Jan 16, 2019 8:43 pm, edited 1 time in total.
Reason: Please use code tags when posting code or logs to the forums. It preserves formatting and makes it easier for everyone to read the code. Click the code button above the reply box and past your code between the tags created.

everone
 
Posts: 29
Joined: Tue Mar 29, 2016 1:23 am

Re: drawing a button and controlling a relay

by asteroid on Thu Jan 17, 2019 5:02 am

>how can I make the button say turn on an led?

This video shows the hardware and code necessary to accomplish lighting multiple LEDs by using TFT push buttons. A similar technique should allow you to trigger a relay.
https://www.youtube.com/watch?v=RQElJFDwQh4

asteroid
 
Posts: 295
Joined: Tue Oct 22, 2013 9:10 pm

Re: drawing a button and controlling a relay

by kcl1s on Thu Jan 17, 2019 8:53 am

everone wrote:hello iam trying to control different analog and digital pins by use of the example code "on-off button".
I don't see how to control anything other then the color of the button itself. how can I make the button say turn on an led?

Using that example code you would just put a digitalWrite in the greenBtn and redBtn functions. Something like this

Code: Select all | TOGGLE FULL SIZE
void redBtn()
{
  tft.fillRect(REDBUTTON_X, REDBUTTON_Y, REDBUTTON_W, REDBUTTON_H, ILI9341_RED);
  tft.fillRect(GREENBUTTON_X, GREENBUTTON_Y, GREENBUTTON_W, GREENBUTTON_H, ILI9341_BLUE);
  drawFrame();
  tft.setCursor(GREENBUTTON_X + 6 , GREENBUTTON_Y + (GREENBUTTON_H/2));
  tft.setTextColor(ILI9341_WHITE);
  tft.setTextSize(2);
  tft.println("ON");
  RecordOn = false;
  digitalWrite(13, HIGH);    //pin control
}

void greenBtn()
{
  tft.fillRect(GREENBUTTON_X, GREENBUTTON_Y, GREENBUTTON_W, GREENBUTTON_H, ILI9341_GREEN);
  tft.fillRect(REDBUTTON_X, REDBUTTON_Y, REDBUTTON_W, REDBUTTON_H, ILI9341_BLUE);
  drawFrame();
  tft.setCursor(REDBUTTON_X + 6 , REDBUTTON_Y + (REDBUTTON_H/2));
  tft.setTextColor(ILI9341_WHITE);
  tft.setTextSize(2);
  tft.println("OFF");
  RecordOn = true;
  digitalWrite(13, LOW);    //pin control
}


Fellow hobbyist
Keith

kcl1s
 
Posts: 1082
Joined: Tue Aug 30, 2016 12:06 pm

Re: drawing a button and controlling a relay

by kcl1s on Thu Jan 17, 2019 9:18 am

Also looking at your watering code this line delay(10000); // delay in between reads for stability will make your touch pad lag and not register the touch until the end of your delay. Look at using millis() as used in the blink without delay example code instead of delay. This is what you need to fit in your code to make it work

Code: Select all | TOGGLE FULL SIZE

unsigned long previousMillis = 0;       
const long readInterval = 10000;         

void setup() {
 
}

void loop() {
  unsigned long currentMillis = millis();   //get current millis
  if (currentMillis - previousMillis >= readInterval) {   //check if time to read
    previousMillis = currentMillis;     //reset previousMillis for next time

    // Put you read update code here!
    // It only runs once every readInterval
    //
    //
  }

  // Put your touch check code here, outside the read update section
  // It will run each time through loop and register touch quickly
}

The first thing we learn in Arduino is delay() then you find most real projects can't use it.

Keith

kcl1s
 
Posts: 1082
Joined: Tue Aug 30, 2016 12:06 pm

Re: drawing a button and controlling a relay

by asteroid on Thu Jan 17, 2019 12:57 pm

Please try to run this simple demo. If you can get it to work then we'll show you how to light up an LED. To make a tft button do something useful, you first need to learn to trap touches inside of the button rectangle. Adafruit_GFX library has done some of the work for you and I think you would be wise to take advantage of it.

Code: Select all | TOGGLE FULL SIZE
/*
 Demonstrates class Adafruit_GFX_Button
 For Adafruit 2.8" TFT LCD - capacitive.
*/

#include "Adafruit_GFX.h"
#include "Adafruit_ILI9341.h"
#include "Adafruit_FT6206.h"

// Default values for Adafruit shield v2.
#define TFT_DC 9
#define TFT_CS 10

// The FT6206 uses hardware I2C (SCL/SDA)
Adafruit_FT6206 ctp = Adafruit_FT6206();
Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC);
Adafruit_GFX_Button btn;

// Assign human-readable names to some common 16-bit color values:
#define BLACK   0x0000
#define BLUE    0x001F
#define GREEN   0x07E0
#define WHITE   0xFFFF

 // Rotations 0,2 = portrait  : 0->USB=right,upper : 2->USB=left,lower
 // Rotations 1,3 = landscape : 1->USB=left,upper  : 3->USB=right,lower
 byte rotation = 1; //(0->3)
 TS_Point p;
 int x, y;

 void btnHandler()
 {
  // inverted
  btn.drawButton(true);
  tft.setCursor(30, 30);
  tft.setTextSize(2);
  tft.print("btn hit.");
  delay(600);
  // normal
  btn.drawButton(false);
  // erase text
  tft.fillRect( 30, 30, 100, 20, BLUE );
 }
 
 void setup() {
  tft.begin();
  if (! ctp.begin()) {
    Serial.println("Couldn't start FT6206 touchscreen controller");
    while (1);
    }   
  tft.setRotation(rotation);
  tft.fillScreen(BLUE);
  btn.initButtonUL( &tft, 150, 60, 100, 50, BLACK, GREEN, WHITE,"OK", 3 );
  btn.drawButton(false);
 }

 void loop() {   
  if (! ctp.touched()) { 
    return;
  }
 p = ctp.getPoint();

 // x,y touch coordinates depend upon screen rotation
 switch (rotation) {
  case 0:
   x = 240 - p.x;
   y = 320 - p.y;
  break;
  case 1:   // p.x, p.y reversed
   x = 320 - p.y;
   y = p.x;
  break;
  case 2:
   x = p.x;
   y = p.y;
  break;
  case 3:  // p.x, p.y reversed
   x = p.y;
   y = 240 - p.x;
  break;
 }
 
  while (ctp.touched()) {
    // If touch occurred inside of button, do something
    if (btn.contains(x,y)) {
      btnHandler();
    }
   }
 }


asteroid
 
Posts: 295
Joined: Tue Oct 22, 2013 9:10 pm

Re: drawing a button and controlling a relay

by asteroid on Thu Jan 17, 2019 4:27 pm

The following code demonstrates how to light an LED using an Adafruit_GFX tft button. Simple LED circuitry is shown in the image below; remember that the LED long pin is positive.
Code: Select all | TOGGLE FULL SIZE
/*
 Demonstrates class Adafruit_GFX_Button
 For Adafruit 2.8" TFT LCD - capacitive.
 Btn press lights LED.
*/

#include "Adafruit_GFX.h"
#include "Adafruit_ILI9341.h"
#include "Adafruit_FT6206.h"

// Default values for Adafruit shield v2.
#define TFT_DC 9
#define TFT_CS 10

// The FT6206 uses hardware I2C (SCL/SDA)
Adafruit_FT6206 ctp = Adafruit_FT6206();
Adafruit_ILI9341 tft = Adafruit_ILI9341(TFT_CS, TFT_DC);
Adafruit_GFX_Button btn;

// Assign human-readable names to some common 16-bit color values:
#define BLACK   0x0000
#define BLUE    0x001F
#define GREEN   0x07E0
#define WHITE   0xFFFF

// LED assigned to output
 const byte LED1 = A10;
 
 // Rotations 0,2 = portrait  : 0->USB=right,upper : 2->USB=left,lower
 // Rotations 1,3 = landscape : 1->USB=left,upper  : 3->USB=right,lower
 byte rotation = 1; //(0->3)
 TS_Point p;
 int x, y;

void btnHandler() {
  // turn LED on and invert btn
  digitalWrite(LED1, HIGH);
  btn.drawButton(true);
  delay(1000);
  // redraw normal btn and turn LED off
  btn.drawButton(false);
  digitalWrite(LED1, LOW);
}

 void setup() {
  tft.begin();
  if (! ctp.begin()) {
    Serial.println("Couldn't start FT6206 touchscreen controller");
    while (1);
    }   
  tft.setRotation(rotation);
  tft.fillScreen(BLUE);
  btn.initButtonUL( &tft, 150, 60, 100, 50, BLACK, GREEN, WHITE,"Btn1", 3 );
  btn.drawButton(false);
  pinMode(LED1, OUTPUT);
  // start with LED off
  digitalWrite(LED1, LOW);
 }

 void loop() {   
  if (! ctp.touched()) { 
    return;
  }
 p = ctp.getPoint();

 // x,y touch coordinates depend upon screen rotation
 switch (rotation) {
  case 0:
   x = 240 - p.x;
   y = 320 - p.y;
  break;
  case 1:   // p.x, p.y reversed
   x = 320 - p.y;
   y = p.x;
  break;
  case 2:
   x = p.x;
   y = p.y;
  break;
  case 3:  // p.x, p.y reversed
   x = p.y;
   y = 240 - p.x;
  break;
 }
 
  while (ctp.touched()) {
    // If touch occurred inside of button, do something
    if (btn.contains(x,y)) {
      btnHandler();
   }
 }
 }



btn_led1.tiff
btn_led1.tiff (847.43 KiB) Viewed 50 times

asteroid
 
Posts: 295
Joined: Tue Oct 22, 2013 9:10 pm

Please be positive and constructive with your questions and comments.