TFT 2,8" Eleego touchscreen reads wrong pixel by pressing a button on it

Projects Programming
1

Hello,

I am currently making following program:

#include "Arduino.h"
#include <Adafruit_TFTLCD.h>
#include <Adafruit_GFX.h>
#include <TouchScreen.h>

#define LCD_CS A3
#define LCD_CD A2
#define LCD_WR A1
#define LCD_RD A0
#define LCD_RESET A4

#define TS_MINX 204
#define TS_MINY 195
#define TS_MAXX 948
#define TS_MAXY 910

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

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

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

boolean buttonEnabled = true;
int currentPage = 0;

void setup()
{
	Serial.begin(9600);
	Serial.print("Starting...");

	tft.reset();
	tft.begin(tft.readID());
	tft.setRotation(1);

	drawHome();
}

void drawHome()
{
	tft.fillScreen(BLACK);

	//Draw white frame
	tft.drawRect(0, 0, 319, 240, WHITE);

	//Print "Hello" Text
	tft.setCursor(100, 30);
	tft.setTextColor(WHITE);
	tft.setTextSize(4);
	tft.print("Hello");

	//Print "YouTube!" text
	tft.setCursor(80, 100);
	tft.setTextColor(RED);
	tft.setTextSize(4);
	tft.print("YouTube!");

	//Create Red Button
	tft.fillRect(60, 180, 200, 40, RED);
	tft.drawRect(60, 180, 200, 40, WHITE);
	tft.setCursor(80, 188);
	tft.setTextColor(WHITE);
	tft.setTextSize(3);
	tft.print("Subscribe!");

	buttonEnabled = true;
}

void loop()
{
	TSPoint p = ts.getPoint();  //Get touch point

	if (p.z > ts.pressureThreshhold)
	{

		Serial.print("X = ");
		Serial.print(p.x);
		Serial.print("\tY = ");
		Serial.print(p.y);
		Serial.print("\n");

		p.x = map(p.x, TS_MAXX, TS_MINX, 0, 320);
		p.y = map(p.y, TS_MAXY, TS_MINY, 0, 240);

		if (p.x > 60 && p.x < 260 && p.y > 180 && p.y < 220 && buttonEnabled
				&& currentPage == 0) // The user has pressed inside the red rectangle
		{
			buttonEnabled = false; //Disable button

			//This is important, because the libraries are sharing pins
			pinMode(XM, OUTPUT);
			pinMode(YP, OUTPUT);

			//Erase the screen
			tft.fillScreen(BLACK);

			//Draw frame
			tft.drawRect(0, 0, 319, 240, WHITE);

			tft.setCursor(50, 50);
			tft.setTextColor(WHITE);
			tft.setTextSize(3);
			tft.print("Thank you for\n\n   subscribing!");

			currentPage = 1;
		}
		delay(10);

		if (p.x > 0 && p.y > 0 && currentPage == 1)
		{
			currentPage = 0;
			drawHome();
		}
	}
}

The writing and the subscribe button is exactly there where it supposed to be, but somehow when I try to press the button, it does not work. It only works when I press in the black between "Hello" and "YouTube!" at the coordinates around X = 529 Y = 353, which the serial monitor showed me.

So what is the exact problem here? How can it be that the pixel are read wrong, but to draw and write stuff on the display the normal coordinates are actual working?

2

The display and the touchscreen are two different objects in your code, as you can see here:

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

The touchscreen should be calibrated before you can use it accurately. Look in your library's examples if there one that does calibration.

3

Hm, unfortunately there is no calibration example there only this pressure demo program:

#include <stdint.h>
#include "TouchScreen.h"

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

// For better pressure precision, we need to know the resistance
// between X+ and X- Use any multimeter to read it
// For the one we're using, its 300 ohms across the X plate
TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);

void setup(void) {
  Serial.begin(9600);
}

void loop(void) {
  // a point object holds x y and z coordinates
  TSPoint p = ts.getPoint();
  
  // we have some minimum pressure we consider 'valid'
  // pressure of 0 means no pressing!
  if (p.z > ts.pressureThreshhold) {
     Serial.print("X = "); Serial.print(p.x);
     Serial.print("\tY = "); Serial.print(p.y);
     Serial.print("\tPressure = "); Serial.println(p.z);
  }

  delay(100);
}

This small program shows me the exact same XY coordinates obviously. But how to calibrate it? I've used Adafruit's library: GitHub - adafruit/Adafruit_TouchScreen: Arduino library for 4-wire resistive touchscreens

4

Can anyone help me here please?

5

the Touchscreen can be calibrated with adjusting these values

#define TS_MINX 204
#define TS_MINY 195
#define TS_MAXX 948
#define TS_MAXY 910

they define the edges of the touchscreen.
Within your code there is a call to map() here:

p.x = map(p.x, TS_MAXX, TS_MINX, 0, 320);
p.y = map(p.y, TS_MAXY, TS_MINY, 0, 240);

but the Serial.print takes place before that copy this section from before the map to after the map conversion:

Serial.print("X = ");
Serial.print(p.x);
Serial.print("\tY = ");
Serial.print(p.y);
Serial.print("\n");

then you will see what the effect is of the map function.
If you want to do some calibrating try and press close to the edge using something pointy and soft like a toothpick and see if you can get higher extremes then the initializes values (compared to the un-mapped values)