hi, im making a keyboard on a tft display to let the user input data to another program, i made a section to display the word which is being written but every new letter added appears corrupted, like a little square with red and blu stripes.
im using a nodeMCU esp8266 board and a ili9341 tft display.
here is my code, i have a function "tasto" which make the buttons to display form the arrays of letters and a function "cheTasto" which checks where the user tapped and confronts the coordinates with the coordinates from the button, if there is a match it prints the corresponding letter.
#include <ESP8266WiFi.h>
#include <ESP8266HTTPClient.h>
#include <SPI.h>
#include <ArduinoJson.h>
#include <TFT_eSPI.h>
#include <WiFiClientSecureBearSSL.h>
TFT_eSPI tft = TFT_eSPI();
#include <XPT2046_Touchscreen.h>
#define TFT_BIANCO 0xFFFF
XPT2046_Touchscreen ts(15);//15 pin gpio di CS
int coorCursX = 27;
int coorCursY = 37;
int posX = 20; //posizione primo tasto
const char* primaRiga[]// lettere prima riga
= { "Q", "W", "E", "R", "T", "Y", "U", "I", "O", "P"};
const char* secondaRiga[]// lettere seconda riga
= { "a", "s", "d", "f", "g", "h", "j", "k", "l",};
void tasto(int pos_tastX, int pos_tastY, String lettera){ //funzione prende posizioni iniziali e lettera, stampa quadrati con lettera al centro
tft.drawRect(pos_tastX, pos_tastY, 20, 20, TFT_BIANCO);
tft.setCursor(pos_tastX+7, pos_tastY+7);// piu 7 pixel entrambe le direzioni rispetto a contorno tasto
if (lettera == "ENT" or lettera == "DEL"){
tft.setCursor(pos_tastX+1, pos_tastY+7);
}
tft.print(lettera);
}
void tastiera(){
for (int i=0; i<10; i += 1){ //esegue la funzione tasto per ogni elemento della lista lettere, spostando la posizione iniziale ogni volta di tanti pixel quanto e' largo un tasto
tasto(posX,150, primaRiga[i]);
posX +=20;
}
posX = 20;
for (int i=0; i<9; i += 1){ //esegue la funzione tasto per ogni elemento della lista lettere, spostando la posizione iniziale ogni volta di tanti pixel quanto e' largo un tasto
tasto(posX,170, secondaRiga[i]);
posX +=20;
}
tasto(220,150, "ENT"); //tasto speciale
tasto(200,170, "DEL"); //tasto speciale
}
void cheTasto(int coordx, int coordy){ //trova tasto premuto e stampa lettera corrispondente
//prende coordinate punto
int xMap = map(coordx, 370 , 3880, 0, 320); //mappa coordinate strane display sui pixel effettivi
int yMap = map(coordy, 250 , 3770, 0, 240);
for (int i=0; i<10; i += 1){ //controlla se punto premuto e' tasto, se lo e' scrive lettera corrispondente
if (xMap > posX && xMap < posX+20 && yMap > 150 && yMap < 170){ //se coordinate rientrano in quelle della prima casella
tft.setCursor(coorCursX, coorCursY);
delay(50);
tft.print(primaRiga[i]);//Serial.print(primaRiga[i]); //scrivi lettera corrispondente
posX = 20; //resetta posizione di controllo
coorCursX += 10;
break;
}
else {
posX+=20; //sposta la casella di controllo 20 pixel o una casella piu in la
}
}
posX= 20;
for (int i=0; i<9; i += 1){
if (xMap > posX && xMap < posX+20 && yMap > 170 && yMap < 190){ //se coordinate rientrano in quelle della prima casella
Serial.print(secondaRiga[i]); //scrivi lettera corrispondente
posX = 20; //resetta posizione di controllo
break;
}
else {
posX+=20; //sposta la casella di controllo 20 pixel o una casella piu in la
}
}
posX= 20;
}
void setup() {
Serial.begin(115200);
tft.init(); //inizializa display
tft.fillScreen(TFT_BLACK);
tft.setRotation(3); // horizontal display
//codice da spostare in funzione tasto
tastiera();
ts.begin();// inizializza touch
// ts.begin(SPI1); // use alternate SPI port
ts.setRotation(1);
while (!Serial && (millis() <= 1000));
tft.drawRect(20, 30, 200, 20, TFT_BIANCO);
tft.drawRect(220, 30, 1, 20, TFT_BIANCO);
}
void loop() {
// put your main code here, to run repeatedly:
if (ts.touched()){
TS_Point p = ts.getPoint();
cheTasto(p.x, p.y);
int xMap = map(p.x, 370 , 3880, 0, 320);
Serial.print(", x = ");
Serial.print(xMap);
int yMap = map(p.y, 250 , 3770, 0, 240);
Serial.print(", y = ");
Serial.print(yMap);
delay(50);
Serial.println();
}
}
