Arduino Touchscreen Calculator: 7 steg

2024 Författare: John Day | [email protected]. Senast ändrad: 2024-01-30 12:44

Hej! Detta är ett projekt för att göra en pekskärmskalkylator med en Arduino Uno och en TFT LCD -skärm. Jag kom på konceptet för min hemundervisningsprogramklass, och erfarenheten av att bygga detta projekt var mycket intressant. Denna räknare kan utföra de fyra enkla matematiska operationerna (addition, subtraktion, multiplikation och division). Det visar också upp till två decimaler för de divisionssvar som har dem. Låt oss dyka direkt in! Förnödenheterna för detta projekt listas nedan.

Tillbehör

- Arduino Uno

-2.4 TFT LCD-skärm (här köpte jag den:

- USB A till B -kabel (sladd för att ansluta Arduino till datorn)

- Dator med Arduino IDE installerat

- Du måste också ladda ner två bibliotek: MCUFRIEND_kbv och pekskärm. Den första kan du hitta på github (länk: https://github.com/prenticedavid/MCUFRIEND_kbv) eller så kan du använda bibliotekets zip -fil som jag har inkluderat nedan. Den andra finns i Arduino Library manager för installation.

Steg 1: Maskinvaruanslutningar

Anslutningen av pekskärmskyddet till Arduino Uno är enkel och snabb. Allt du behöver göra är att ställa in de lägsta stiften på skölden med de lägsta stiften på Arduino och skjuta in skölden i stiften. Den övre 5V -stiftet och den omärkta stiftet på kraftsidan bör inte ha stift från skölden i dem, med samma parametrar som gäller för stiften märkta SCL och SDA på andra sidan av brädet. Nu är vi redo att koda!

Steg 2: Koden: Global Definitions & Setup

#omfatta

MCUFRIEND_kbv tft; // fastkopplad för UNO-sköldar ändå

#omfatta

#definiera YP A3

#define XM A2

#definiera YM 9

#define XP 8

TouchScreen ts = TouchScreen (XP, YP, XM, YM, 300);

#define MINPRESSURE 10

Detta är början på koden, där vi inkluderar bibliotek (MCUFRIEND_kbv och pekskärm), definierar X- och Y -stiften, ställer in pekskärmsparametrarna och definierar minimitryck som krävs för att Arduino ska kunna registrera en användarpress.

int ID;

int user_selection;

float sparat_nummer = 0;

float term1;

int op_num;

flytresultat;

int cursorLocX = 5;

int cursorLocY = 20;

Precis före installationen måste vi ställa in några globala variabler. ID hjälper till att få igång pekskärmen. user_selection innehåller ett nummer som motsvarar den knapp som användaren väljer när du trycker på pekskärmen. save_number är variabeln som vi skriver ut på skärmen efter en användarpost (mer om detta i loop). Det är en flottör så att den kan hålla decimalnummer såväl som heltal. term1 är variabeln som det första numret i ekvationen sparas i efter att en operand har valts. op_num sparar operanden som ett tal (1 för addition, 2 för subtraktion, 3 för multiplikation och 4 för division). resultatet är variabeln som skrivs ut på skärmen efter att användaren har tryckt på likhetstecknet. Det är också en flottör. cursorLocX och cursorLocY är mappningspunkterna på pekskärmen där markören är inställd på flera gånger (den finns i det grå fältet högst upp, annars kallat resultatfältet).

void setup () {

tft.reset ();

ID = tft.readID ();

tft.begin (ID);

tft.setRotation (0);

tft.fillScreen (TFT_DARKGREY);

rutor ();

tal();

tft.setTextSize (3);

tft.setTextColor (TFT_BLUE, TFT_DARKGREY);

}

Vår installationsfunktion innehåller först initialiseringen för pekskärmskyddet (rad 1-3). Sköldens orientering ställs in med kommandot tft.setRotation (), där 0 är upprätt. Hela skärmen är mörkgrå med kommandot tft.fillScreen (), som vi skriver överst på (förutom resultatfältet). Kvadraterna () och siffrorna () ritar kalkylatorns rutor, färgar rutorna svartvita i ett rutmönster och skriver siffror/operander på rutorna i blått. Vi kommer till dem i nästa steg. Kommandot tft.setTextSize () ställer in textstorleken för resultatfältet till 3, vilket är ett medelteckensnitt. Kommandot tft.setTextColor () anger resultatfältets textfärg till blå, som skrivs över det mörkgrå fältet.

Steg 3: Koden: Loop

void loop () {numberSelect ();

fördröjning (100);

if (user_selection == 16) {

;

}annan{

if (user_selection <10) {

sparat_nummer = sparat_nummer * 10 + användarval;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (sparat_nummer);

} annat om (användarval> 10) {

switch (user_selection) {

fall 11:

op_num = 1;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("+");

term1 = sparat_nummer;

sparat_nummer = 0;

ha sönder;

fall 12:

op_num = 2;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("-");

term1 = sparat_nummer;

sparat_nummer = 0;

ha sönder;

fall 13:

op_num = 3;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("X");

term1 = sparat_nummer;

sparat_nummer = 0;

ha sönder;

fall 14:

op_num = 4;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("/");

term1 = sparat_nummer;

sparat_nummer = 0;

ha sönder;

fall 15:

sparat_nummer = 0;

term1 = 0;

op_num = 0;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

ha sönder;

}

tft.setCursor (cursorLocX, cursorLocY);

Detta är mycket att tugga, så jag ska förklara vad som står ovan. Vi börjar med att ringa funktionen numberSelect (), som tilldelar ett nummer till varje ruta på pekskärmen. När en användare trycker på en av dessa rutor, ställer funktionen variabeln user_selection till kvadratens nummer. Den första if -satsen ska bara köras genom slingan om ett giltigt användarval har gjorts. Om så är fallet frågar nästa if-sats om användarval har ett tal mindre än 10 sparat i det (siffrorna 0-9). Om det gör det, multipliceras sparat_tal med 10 och antalet i användarval läggs till i sparat_nummer, som skrivs ut i resultatfältet på pekskärmen. Om det inte gör det frågar nästa if -sats om användarval har ett tal som är större än 10 sparat i det (operandnumren: 11 för +, 12 för -, 13 för X, 14 för /och 15 för den tydliga skärmens kvadrat). En switch -funktion tar hand om varje fall (bestäms av user_selection). Variabeln op_num ges ett tal som motsvarar operanden som valdes (1 för +, 2 för -, 3 för X och 4 för /). Värdet i sparat_nummer sparas i variabeln term1 så att variabeln sparat_nummer kan användas för ekvationens andra hälft. Operandsymbolen skrivs ut på skärmen tillsammans med att rensa alla siffror i resultatfältet. Det enda undantaget är den tydliga skärmens torg, som återställer alla beräkningsvariabler och rensar resultatfältet för allt som finns på den.

}annan{

switch (op_num) {

fall 1:

resultat = term1 + sparat_nummer;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (dubbel (resultat));

ha sönder;

fall 2:

resultat = term1 - sparat_nummer;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (dubbel (resultat));

ha sönder;

fall 3:

resultat = term1 * sparat_nummer;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (dubbel (resultat));

ha sönder;

fall 4:

resultat = float (term1) / float (sparat_nummer);

tft.setCursor (cursorLocX, cursorLocY);

tft.print (resultat);

ha sönder;

}

tft.setCursor (cursorLocX, cursorLocY);

sparat_nummer = resultat;

term1 = 0;

op_num = 0;

fördröjning (1000);

}

}

}

Den sista delen av slingan behandlar händelsen där användaren väljer likhetstecknet (user_selection == 10). En annan switchfunktion fungerar genom de fyra matematiska funktionerna (bestäms av op_num). Additionsfallet (fall 1) lägger till term1 och sparat_nummer tillsammans och sparar numret i resultatvariabeln. Resultatet skrivs ut till resultatfältet som en dubbel. Subtraktionsfallet (fall 2) subtraherar sparat_tal från term1 och sparar numret i resultatvariabeln. Resultatet skrivs ut till resultatfältet som en dubbel. Multiplikationsfallet (fall 3) multiplicerar term1 med save_number och sparar numret i resultatvariabeln. Resultatet skrivs ut till resultatfältet som en dubbel. Divisionsfallet (fall 4) delar term1 med sparat_tal tillsammans och sparar numret i resultatvariabeln. Resultatet skrivs ut i resultatfältet som en float (eftersom divisionssvaren kan vara decimaltal). Efter att antingen ett nummer, operand eller resultat skrivs ut på skärmen återställs markören, sparat_tal sätts till föregående resultat och term1 & op_num återställs.

Några anmärkningar: användaren kan inte ange decimalnummer i miniräknaren på grund av avsaknaden av en decimalpunkt. Användaren kan också bara göra en ekvation i taget. Du kan inte beräkna ett resultat och sedan lägga till/subtrahera/multiplicera/dividera det resultatet. I funktionen numberSelect () finns en funktion som rensar skärmen efter att ett resultat har skrivits ut om en användare har tryckt på en annan ruta.

Steg 4: Funktionen kod: kvadrater

ogiltiga rutor () {

// svarta och vita rutor alternerar på varje rad och den första och tredje raden har ett motsatt mönster än den andra och fjärde raden

tft.fillRect (0, 60, 60, 65, TFT_BLACK); // första raden med rutor börjar, svart till vitt tft.fillRect (60, 60, 60, 65, TFT_WHITE);

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

tft.fillRect (180, 60, 60, 65, TFT_WHITE); // första raden med rutor slutar

tft.fillRect (0, 125, 60, 65, TFT_WHITE); // andra raden med rutor börjar, vit till svart tft.fillRect (60, 125, 60, 65, TFT_BLACK);

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

tft.fillRect (180, 125, 60, 65, TFT_BLACK); // andra raden med rutor slutar

tft.fillRect (0, 190, 60, 65, TFT_BLACK); // tredje raden med rutor börjar, svart till vitt tft.fillRect (60, 190, 60, 65, TFT_WHITE);

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

tft.fillRect (180, 190, 60, 65, TFT_WHITE); // tredje raden med rutor slutar

tft.fillRect (0, 255, 60, 65, TFT_WHITE); // fjärde raden med rutor börjar, vit till svart tft.fillRect (60, 255, 60, 65, TFT_BLACK);

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

tft.fillRect (180, 255, 60, 65, TFT_BLACK); // fjärde raden med rutor slutar

}

Kvadratfunktionen () är ganska enkel. Kommandot tft.fillRect (X1, Y1, X2, Y2, TFT_COLOR) ritar en rektangel enligt de parametrar som skickas till den, som är x och y: s första positioner, x och y: s andra positioner, och färgen som rektangeln fylls med. Denna funktion ritar alla fyra rader med rutor (tekniskt rektanglar) och fyller varje kvadrat med färgen som skickas till den.

Steg 5: Funktionen kod: nummer

ogiltiga nummer () {

tft.setTextColor (TFT_BLUE); // ställer in färg/teckenfärg till blå

tft.setTextSize (5); // anger antal/teckenstorlek till 5

tft.setCursor (18, 75); // ställer markören för första raden med siffror/tecken

tft.print ("7 8 9 /"); // skriver ut första raden med siffror/tecken

tft.setCursor (18, 140); // ställer markören för den andra raden med siffror/tecken

tft.print ("4 5 6 X"); // skriver ut den andra raden med siffror/tecken

tft.setCursor (18, 205); // ställer markören för tredje raden med siffror/tecken

tft.print ("1 2 3 -"); // skriver ut tredje raden med siffror/tecken

tft.setCursor (18, 270); // ställer markören för fjärde raden med siffror/tecken

tft.print ("C 0 = +"); // skriver ut fjärde raden med siffror/tecken

}

Numren () -funktionen är också enkel. De två första raderna ställer in textstorleken större och färgen till blå. Kommandot tft.setCursor () sätter markören till positionen på varje rad där skrivningen av siffrorna börjar. Kommandot tft.print () skriver sedan ut siffrorna/tecknen över rutorna.

Steg 6: Koden: NumberSelect Function

void numberSelect () {

TSPoint p = ts.getPoint ();

pinMode (XM, OUTPUT);

pinMode (YP, OUTPUT);

om (p.z> MINPRESSURE) {

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

p.y = map (p.y, 245, 860, 0, 319);

om (resultat! = 0) {

resultat = 0;

sparat_nummer = 0;

tft.print ("RENGÖR VÄRDEN");

fördröjning (500);

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

tft.setCursor (cursorLocX, cursorLocY);

}

För att starta funktionen numberSelect () ber vi om användarinmatning från pekskärmen med kommandot ts.getPoint (). När denna data har samlats in kontrollerar vi om minimitrycket har överskridits (eller, med andra ord, om användaren har tryckt någonstans på pekskärmen). Om det är det, mappas x- och y-koordinaterna från kartesiska koordinater till pekskärmsspecifika koordinater. (0, 0) är det övre vänstra hörnet på pekskärmen, med x -axeln går tvärs och y -axeln går ner. Nästa del kontrollerar om det finns ett nummer sparat i resultatet. Om det finns, återställs resultat och sparat_tal till 0. Meddelandet "CLEAR VALUES" skrivs ut över resultatfältet och skärmen rensas med markören tillbaka till utgångsläget.

if (s.y. 60) {// första raden med rutor

om (s. x <60)

user_selection = 7;

annars om (s. x <120)

user_selection = 8;

annat om (s. x <180)

user_selection = 9;

annars user_selection = 14;

} annars if (s.y 125) {// andra raden med rutor

om (s. x <60)

user_selection = 4;

annars om (s. x <120)

user_selection = 5;

annat om (s. x <180)

user_selection = 6;

annars user_selection = 13;

} annars if (s.y 190) {// tredje raden med rutor

om (s. x <60)

user_selection = 1;

annars om (s. x <120)

user_selection = 2;

annat om (s. x <180)

user_selection = 3;

annars user_selection = 12;

} annars if (s.y> 255) {// fjärde raden med rutor

om (s. x <60)

user_selection = 15;

annars om (s. x <120)

user_selection = 0;

annat om (s. x <180)

user_selection = 10;

annars user_selection = 11;

}

}annan{

user_selection = 16; // user_selection är inställt på 16 (ingenting variabel)

}

}

Detta är den del som avgör vilken knapp som har valts. Börjar med den översta raden med rutor och slutar med den nedre raden, Arduino letar efter var skärmen faktiskt trycktes på. Det tilldelar sedan rutan ett tal och sparar det numret i user_selection. Siffrorna 0-9 motsvarar siffrorna, siffrorna 11-15 motsvarar operandkvadraterna och den tydliga rutan, och talet 10 motsvarar kvadratet med likhetstecknet. Om ingen ruta har valts, är user_selection inställt på 16, vilket gör att slingan börjar om igen (se loop -funktion).

Steg 7: Njut av ditt färdiga projekt

Där har du det! Du har nu en pekskärmsräknare som kan göra addition, subtraktion, multiplikation och division. Detta projekt förändrade hela sättet jag trodde att en miniräknare fungerade. När jag arbetade med detta projekt kommer jag ihåg att jag sa till min instruktör i klassen: "Jag kommer aldrig att titta på en miniräknare igen!" De funktioner du som användare tycker är lätta är något svåra när du sitter bakom datorn och försöker efterlikna din idé. Jag hoppas att du gillade projektet, och jag hoppas att din inställning till hur en miniräknare fungerar har ändrats också!

Här är hela koden för din bekvämlighet. Den är fylld med kommentarer så om du har några problem ska de visa dig vad varje rad gör.