Calculadora de pantalla tàctil Arduino: 7 passos

2024 Autora: John Day | [email protected]. Última modificació: 2024-01-30 08:13

Hola! Es tracta d’un projecte per fer una calculadora de pantalla tàctil mitjançant un Arduino Uno i un escut TFT LCD. Vaig arribar al concepte de la meva classe de programació d’escola domèstica i l’experiència en la construcció d’aquest projecte va ser molt interessant. Aquesta calculadora pot fer les quatre operacions matemàtiques simples (suma, resta, multiplicació i divisió). També mostra fins a dos punts decimals per a les respostes de divisió que en tenen. Busquem directament! Els subministraments d’aquest projecte s’enumeren a continuació.

Subministraments

- Arduino Uno

- Escut LCD 2.4 TFT (aquí el vaig comprar:

- Cable USB A a B (cable per connectar Arduino a l'ordinador)

- Ordinador amb Arduino IDE instal·lat

- També haureu de descarregar dues llibreries: MCUFRIEND_kbv i pantalla tàctil. El primer que podeu trobar a github (enllaç: https://github.com/prenticedavid/MCUFRIEND_kbv) o podeu utilitzar el fitxer zip de la biblioteca que he inclòs a continuació. El segon es troba al gestor de la biblioteca Arduino per a la instal·lació.

Pas 1: connexions de maquinari

La connexió de la pantalla tàctil a l’Arduino Uno és senzilla i ràpida. Tot el que heu de fer és alinear els pins més baixos de l’escut amb els pins més baixos de l’Arduino i empènyer l’escut als pins. El pin superior de 5V i el pin sense etiquetes del costat de l’alimentació no haurien de tenir pins de l’escut, amb els mateixos paràmetres que s’apliquen als pins etiquetats SCL i SDA a l’altre costat de la placa. Ara estem a punt per codificar.

Pas 2: el codi: definicions i configuració globals

#incloure

MCUFRIEND_kbv tft; // per cable per a escuts UNO de totes maneres

#incloure

#defineix YP A3

#define XM A2

#defineix YM 9

#define XP 8

Pantalla tàctil ts = Pantalla tàctil (XP, YP, XM, YM, 300);

#define MINPRESSURE 10

Aquest és el començament del codi, on incloem biblioteques (MCUFRIEND_kbv i pantalla tàctil), definim els pins X i Y, configurem els paràmetres de la pantalla tàctil i definim la pressió mínima necessària perquè Arduino registri una premsa d’usuari.

int ID;

int selecció_usuari;

nombre flotat guardat = 0;

terme flotant1;

int op_num;

resultat flotant;

int cursorLocX = 5;

int cursorLocY = 20;

Just abans de la configuració, hem de configurar algunes variables globals. La identificació us ajuda a fer funcionar la pantalla tàctil. user_selection té un número que correspon a la tecla que l'usuari selecciona en prémer la pantalla tàctil. save_number és la variable que imprimim a la pantalla després d'una entrada d'usuari (més informació al bucle). És un flotant, de manera que pot contenir nombres decimals i enters. terme1 és la variable en què es desa el primer número de l'equació després de seleccionar un operand. op_num desa l'operand com a número (1 per sumar, 2 per restar, 3 per multiplicar i 4 per dividir). El resultat és la variable que s’imprimeix a la pantalla després que l’usuari hagi premut el signe igual. També és una carrossa. cursorLocX i cursorLocY són els punts de mapatge de la pantalla tàctil on el cursor està configurat diverses vegades (es troba a la barra gris de la part superior, coneguda també com a camp de resultats).

configuració nul·la () {

tft.reset ();

ID = tft.readID ();

tft.begin (ID);

tft.setRotation (0);

tft.fillScreen (TFT_DARKGREY);

quadrats ();

números ();

tft.setTextSize (3);

tft.setTextColor (TFT_BLUE, TFT_DARKGREY);

}

La nostra funció de configuració conté primer la inicialització de l’escut de la pantalla tàctil (línies 1-3). L'orientació de l'escut s'estableix mitjançant l'ordre tft.setRotation (), amb 0 en posició vertical. Tota la pantalla és de color gris fosc amb l'ordre tft.fillScreen (), que escriurem a la part superior (excepte el camp de resultats). Les funcions quadrats () i números () dibuixen els quadrats de la calculadora, acoloreixen els quadrats en blanc i negre amb un patró de quadres i escriuen nombres / operands als quadrats en blau. Arribarem a les del pas següent. L'ordre tft.setTextSize () estableix la mida del text del camp de resultats a 3, que és un tipus de lletra mitjà. L'ordre tft.setTextColor () estableix el color del text del camp de resultats en blau, que s'escriu sobre el camp gris fosc.

Pas 3: el codi: bucle

bucle buit () {numberSelect ();

retard (100);

if (selecció_usuari == 16) {

;

} més {

if (selecció_usuari <10) {

número_salvat = número_salvat * 10 + selecció_usuari;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (número_ guardat);

} else if (selecció_usuari> 10) {

commutador (selecció_usuari) {

cas 11:

op_num = 1;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("+");

terme1 = número_desat;

número_salvat = 0;

trencar;

cas 12:

op_num = 2;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("-");

terme1 = número_desat;

número_salvat = 0;

trencar;

cas 13:

op_num = 3;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("X");

terme1 = número_desat;

número_salvat = 0;

trencar;

cas 14:

op_num = 4;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("/");

terme1 = número_desat;

número_salvat = 0;

trencar;

cas 15:

número_salvat = 0;

terme1 = 0;

op_num = 0;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

trencar;

}

tft.setCursor (cursorLocX, cursorLocY);

Això és molt per mastegar, així que explicaré el que hi ha a sobre. Comencem trucant a la funció numberSelect (), que assigna un número a cada quadrat de la pantalla tàctil. Quan un usuari prem un d'aquests quadrats, la funció estableix la variable user_selection al nombre del quadrat. La primera sentència if només s'executarà a través del bucle si s'ha fet una selecció d'usuari vàlida. Si és així, a la següent sentència if es pregunta si selecció_usuari té un número inferior a 10 guardat (els números del 0 al 9). Si ho fa, número_salvat es multiplica per 10 i el número de selecció_usuari s’afegeix a número_salvat, que s’imprimeix al camp de resultats de la pantalla tàctil. Si no ho fa, la següent sentència if demana si la selecció d'usuari té un número superior a 10 desat (els números d'operands: 11 per a +, 12 per a -, 13 per a X, 14 per a / i 15 per a la casella de pantalla neta)). Una funció de commutador s’encarrega de cada cas (determinada per user_selection). A la variable op_num se li dóna un número que correspon a l'operant seleccionat (1 per a +, 2 per a -, 3 per X i 4 per /). El valor de save_number es desa a la variable terme1 de manera que la variable save_number es pot utilitzar per a la segona meitat de l'equació. El símbol de l’operand s’imprimeix a la pantalla junt amb l’esborrat de qualsevol número del camp de resultats. L'única excepció és el quadrat de pantalla neta, que restableix totes les variables de càlcul i neteja el camp de resultats de qualsevol cosa que hi hagi.

} més {

commutador (op_num) {

cas 1:

resultat = terme1 + número_desat;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (doble (resultat));

trencar;

cas 2:

resultat = terme1 - número_destalat;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (doble (resultat));

trencar;

cas 3:

resultat = terme1 * número_ guardat;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (doble (resultat));

trencar;

cas 4:

resultat = float (terme1) / float (número_ guardat);

tft.setCursor (cursorLocX, cursorLocY);

tft.print (resultat);

trencar;

}

tft.setCursor (cursorLocX, cursorLocY);

número_ guardat = resultat;

terme1 = 0;

op_num = 0;

retard (1000);

}

}

}

L'última part del bucle tracta de l'esdeveniment que l'usuari selecciona el signe igual (selecció_usuari == 10). Una altra funció de commutador funciona a través de les quatre funcions matemàtiques (determinades per op_num). El cas addicional (cas 1) afegeix terme1 i número_descrit junts i desa el número a la variable de resultat. El resultat s’imprimeix al camp de resultats com a doble. El cas de la resta (cas 2) resta número_ guardat del terme1 i desa el número a la variable de resultat. El resultat s’imprimeix al camp de resultats com a doble. El cas de multiplicació (cas 3) multiplica el terme 1 per número_salvat i desa el número a la variable de resultat. El resultat s’imprimeix al camp de resultats com a doble. El cas de divisió (cas 4) divideix el terme 1 per número_salvat i desa el número a la variable de resultat. El resultat s’imprimeix al camp de resultats com a flotant (perquè les respostes a la divisió poden ser nombres decimals). Després d'imprimir a la pantalla un número, un operant o un resultat, es restableix el cursor, es guarda número_definit al resultat anterior i es restableixen el terme 1 i op_num.

Algunes notes: l'usuari no pot introduir nombres decimals a la calculadora a causa de la manca d'un quadrat de punt decimal. A més, l'usuari només pot fer una equació a la vegada. No podeu calcular un resultat i, a continuació, afegir / restar / multiplicar / dividir aquest resultat. A la funció numberSelect (), hi ha una funció que neteja la pantalla després d'imprimir un resultat si un usuari ha premut un altre quadrat.

Pas 4: la funció Codi: quadrats

caselles buides () {

// els quadrats blancs i negres s’alternen a cada fila i la primera i la tercera fila tenen un patró oposat que la segona i la quarta fila

tft.fillRect (0, 60, 60, 65, TFT_BLACK); // comença la primera fila de quadrats, tft.fillRect de negre a blanc (60, 60, 60, 65, TFT_WHITE);

tft.fillRect (120, 60, 60, 65, TFT_BLACK);

tft.fillRect (180, 60, 60, 65, TFT_WHITE); // acaba la primera fila de quadrats

tft.fillRect (0, 125, 60, 65, TFT_WHITE); // comença la segona fila de quadrats, blanc a negre tft.fillRect (60, 125, 60, 65, TFT_BLACK);

tft.fillRect (120, 125, 60, 65, TFT_WHITE);

tft.fillRect (180, 125, 60, 65, TFT_BLACK); // finalitza la segona fila de quadrats

tft.fillRect (0, 190, 60, 65, TFT_BLACK); // comença la tercera fila de quadrats, tft.fillRect de negre a blanc (60, 190, 60, 65, TFT_WHITE);

tft.fillRect (120, 190, 60, 65, TFT_BLACK);

tft.fillRect (180, 190, 60, 65, TFT_WHITE); // finalitza la tercera fila de quadrats

tft.fillRect (0, 255, 60, 65, TFT_WHITE); // comença la quarta fila de quadrats, blanc a negre tft.fillRect (60, 255, 60, 65, TFT_BLACK);

tft.fillRect (120, 255, 60, 65, TFT_WHITE);

tft.fillRect (180, 255, 60, 65, TFT_BLACK); // acaba la quarta fila de quadrats

}

La funció quadrats () és bastant senzilla. L’ordre tft.fillRect (X1, Y1, X2, Y2, TFT_COLOR) dibuixa un rectangle d’acord amb els paràmetres que se li passen, que són les primeres posicions de xy, les segones posicions de xy, i el color amb què s’omple el rectangle.. Aquesta funció dibuixa les quatre files de quadrats (tècnicament rectangles) i omple cada quadrat amb el color que li passa.

Pas 5: la funció Codi: números

números buits () {

tft.setTextColor (TFT_BLUE); // estableix el color del número / caràcter en blau

tft.setTextSize (5); // estableix la mida del número / caràcter a 5

tft.setCursor (18, 75); // estableix el cursor per a la primera línia de números / caràcters

tft.print ("7 8 9 /"); // imprimeix la primera línia de números / caràcters

tft.setCursor (18, 140); // estableix el cursor per a la segona línia de nombres / caràcters

tft.print ("4 5 6 X"); // imprimeix la segona línia de números / caràcters

tft.setCursor (18, 205); // estableix el cursor per a la tercera línia de números / caràcters

tft.print ("1 2 3 -"); // imprimeix la tercera línia de nombres / caràcters

tft.setCursor (18, 270); // estableix el cursor per a la quarta línia de nombres / caràcters

tft.print ("C 0 = +"); // imprimeix la quarta línia de nombres / caràcters

}

La funció numbers () també és senzilla. Les dues primeres línies estableixen la mida del text més gran i el color en blau. L'ordre tft.setCursor () estableix el cursor a la posició de cada fila des d'on comença l'escriptura dels números. A continuació, l'ordre tft.print () imprimeix els números / caràcters sobre els quadrats.

Pas 6: El codi: funció NumberSelect

void numberSelect () {

TSPoint p = ts.getPoint ();

pinMode (XM, OUTPUT);

pinMode (YP, OUTPUT);

if (p.z> MINPRESSIÓ) {

p.x = mapa (p.x, 250, 845, 0, 239);

py = mapa (py, 245, 860, 0, 319);

si (resultat! = 0) {

resultat = 0;

número_salvat = 0;

tft.print ("VALORS CLEAR");

retard (500);

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

tft.setCursor (cursorLocX, cursorLocY);

}

Per iniciar la funció numberSelect (), demanem l’entrada de l’usuari des de la pantalla tàctil amb l’ordre ts.getPoint (). Un cop recollides aquestes dades, comprovem si s’ha superat la pressió mínima (o, dit d’una altra manera, si l’usuari ha premut en algun lloc de la pantalla tàctil). Si és així, les coordenades x i y es mapen des de coordenades cartesianes fins a coordenades específiques de la pantalla tàctil. (0, 0) és l'extrem superior esquerre de la pantalla tàctil, amb l'eix x creuant i l'eix y baixant. La següent part comprova si hi ha un número desat al resultat. Si n'hi ha, el resultat i el número guardat es restableixen a 0. El missatge "BORRAR VALORS" s'imprimeix sobre el camp de resultats i la pantalla s'esborra amb el cursor de nou a la posició inicial.

if (pàg. 60) {// primera fila de quadrats

si (p.x <60)

selecció_usuari = 7;

else if (p.x <120)

selecció_usuari = 8;

else if (p.x <180)

selecció_usuari = 9;

else user_selection = 14;

} else if (pàg. 125) {// segona fila de quadrats

si (p.x <60)

selecció_usuari = 4;

else if (p.x <120)

selecció_usuari = 5;

else if (p.x <180)

selecció_usuari = 6;

else, selecció_usuari = 13;

} else if (pàg. 190) {// tercera fila de quadrats

if (p.x <60)

selecció_usuari = 1;

else if (p.x <120)

selecció_usuari = 2;

else if (p.x <180)

selecció_usuari = 3;

else user_selection = 12;

} else if (p.y> 255) {// quarta fila de quadrats

si (p.x <60)

selecció_usuari = 15;

else if (p.x <120)

selecció_usuari = 0;

else if (p.x <180)

selecció_usuari = 10;

else user_selection = 11;

}

} més {

selecció_usuari = 16; // selecció_usuari s'estableix en 16 (res variable)

}

}

Aquesta és la part que determina quin botó s'ha seleccionat. Començant per la fila superior de quadrats i acabant per la fila inferior, l’Arduino busca on es va prémer la pantalla. A continuació, assigna un número al quadrat i el desa a user_selection. Els números del 0 al 9 corresponen als quadrats numèrics, els números 11-15 corresponen als quadrats dels operands i al quadrat transparent i el número 10 correspon al quadrat del signe igual. Si no s'ha seleccionat cap quadrat, la selecció_usuari s'estableix en 16, cosa que farà que el bucle es torni a començar (vegeu la funció de bucle).

Pas 7: gaudiu del vostre projecte acabat

Aquí el teniu! Ara teniu una calculadora de pantalla tàctil que permet fer sumes, restes, multiplicacions i divisions. Aquest projecte va canviar tota la meva manera de pensar que funcionava una calculadora. Mentre treballava en aquest projecte, recordo que vaig dir al meu instructor a classe: "Mai més no miraré una calculadora de la mateixa manera!" Les funcions que, com a usuari, creieu que són fàcils, són una mica difícils quan esteu darrere de l’ordinador intentant imitar la vostra idea. Espero que us hagi agradat el projecte i espero que també s’hagi canviat la vostra mentalitat sobre el funcionament d’una calculadora.

Aquí teniu el codi complet per a la vostra comoditat. S'omple de comentaris, de manera que si teniu algun problema us han de mostrar què fa cada línia.