Calculadora da tela de toque Arduino: 7 etapas

2024 Autor: John Day | [email protected]. Última modificação: 2024-01-30 11:37

Olá! Este é um projeto para fazer uma calculadora touchscreen usando um Arduino Uno e um escudo TFT LCD. Eu vim com o conceito para minha aula de programação de ensino doméstico, e a experiência na construção deste projeto foi muito interessante. Esta calculadora pode fazer as quatro operações matemáticas simples (adição, subtração, multiplicação e divisão). Ele também exibe até duas casas decimais para as respostas da divisão que as possuem. Vamos mergulhar de cabeça! Os suprimentos para este projeto estão listados abaixo.

Suprimentos

- Arduino Uno

- 2.4 TFT LCD Shield (aqui é onde eu comprei:

- Cabo USB A para B (cabo para conectar o Arduino ao computador)

- Computador com Arduino IDE instalado

- Você também precisará baixar duas bibliotecas: MCUFRIEND_kbv e Touchscreen. O primeiro você pode encontrar no github (link: https://github.com/prenticedavid/MCUFRIEND_kbv) ou pode usar o arquivo zip da biblioteca que incluí abaixo. O segundo está no gerenciador de biblioteca do Arduino para instalação.

Etapa 1: conexões de hardware

A conexão do escudo da tela de toque ao Arduino Uno é simples e rápida. Tudo o que você precisa fazer é alinhar os pinos mais baixos da blindagem com os pinos mais baixos do Arduino e empurrar a blindagem nos pinos. O pino de 5 V superior e o pino não rotulado no lado da alimentação não devem ter pinos da blindagem neles, com os mesmos parâmetros aplicáveis aos pinos rotulados como SCL e SDA no outro lado da placa. Agora, estamos prontos para codificar!

Etapa 2: O Código: Definições Globais e Configuração

#incluir

MCUFRIEND_kbv tft; // conectado para escudos UNO de qualquer maneira

#incluir

# define YP A3

# define XM A2

# define YM 9

#define XP 8

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

# define MINPRESSURA 10

Este é o início do código, onde incluímos bibliotecas (MCUFRIEND_kbv e tela sensível ao toque), definimos os pinos X e Y, configuramos os parâmetros da tela sensível ao toque e definimos a pressão mínima necessária para o Arduino registrar uma pressão do usuário.

int ID;

int user_selection;

float saved_number = 0;

float term1;

int op_num;

resultado flutuante;

int cursorLocX = 5;

int cursorLocY = 20;

Antes da configuração, precisamos configurar algumas variáveis globais. O ID ajuda a colocar a tela de toque em funcionamento. user_selection contém um número que corresponde à tecla que o usuário seleciona ao pressionar a tela sensível ao toque. save_number é a variável que imprimimos na tela após uma entrada do usuário (mais sobre isso no loop). É um float, portanto, pode conter números decimais, bem como inteiros. term1 é a variável em que o primeiro número da equação é salvo depois que um operando é selecionado. op_num salva o operando como um número (1 para adição, 2 para subtração, 3 para multiplicação e 4 para divisão). resultado é a variável que é impressa na tela depois que o usuário pressiona o sinal de igual. Também é um flutuador. cursorLocX e cursorLocY são os pontos de mapeamento na tela sensível ao toque onde o cursor é definido várias vezes (ele está localizado na barra cinza na parte superior, também conhecido como campo de resultados).

void setup () {

tft.reset ();

ID = tft.readID ();

tft.begin (ID);

tft.setRotation (0);

tft.fillScreen (TFT_DARKGREY);

quadrados ();

números();

tft.setTextSize (3);

tft.setTextColor (TFT_BLUE, TFT_DARKGREY);

}

Nossa função de configuração primeiro contém a inicialização para a proteção da tela de toque (linhas 1-3). A orientação da blindagem é definida usando o comando tft.setRotation (), com 0 sendo vertical. A tela inteira é colorida em cinza escuro com o comando tft.fillScreen (), que escreveremos por cima (exceto para o campo de resultados). As funções de quadrados () e números () desenham os quadrados da calculadora, colorem os quadrados em preto e branco em um padrão xadrez e escrevem números / operandos nos quadrados em azul. Chegaremos a eles na próxima etapa. O comando tft.setTextSize () define o tamanho do texto do campo de resultados para 3, que é uma fonte média. O comando tft.setTextColor () define a cor do texto do campo de resultados como azul, que é escrito sobre o campo cinza escuro.

Etapa 3: O Código: Loop

void loop () {numberSelect ();

atraso (100);

if (user_selection == 16) {

;

}outro{

if (user_selection <10) {

save_number = saved_number * 10 + user_selection;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (número salvo);

} else if (user_selection> 10) {

switch (user_selection) {

caso 11:

op_num = 1;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("+");

term1 = número_ guardado;

número_alvo = 0;

pausa;

caso 12:

op_num = 2;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("-");

term1 = número_ guardado;

número_alvo = 0;

pausa;

caso 13:

op_num = 3;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("X");

term1 = número_ guardado;

número_alvo = 0;

pausa;

caso 14:

op_num = 4;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("/");

term1 = número_ guardado;

número_alvo = 0;

pausa;

caso 15:

número_alvo = 0;

termo1 = 0;

op_num = 0;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

pausa;

}

tft.setCursor (cursorLocX, cursorLocY);

Isso é muito para mastigar, então vou explicar o que está acima. Começamos chamando a função numberSelect (), que atribui um número a cada quadrado na tela sensível ao toque. Quando um usuário pressiona um desses quadrados, a função define a variável user_selection para o número do quadrado. A primeira instrução if deve percorrer o loop apenas se uma seleção de usuário válida tiver sido feita. Se for, a próxima instrução if pergunta se user_selection tem um número menor que 10 salvo nela (os números 0-9). Em caso afirmativo, saved_number é multiplicado por 10 e o número em user_selection é adicionado a saved_number, que é impresso no campo de resultados na tela sensível ao toque. Se não, a próxima instrução if pergunta se user_selection tem um número maior que 10 salvo nele (os números dos operandos: 11 para +, 12 para -, 13 para X, 14 para / e 15 para o quadrado da tela limpa) Uma função switch cuida de cada caso (determinado por user_selection). A variável op_num recebe um número que corresponde ao operando que foi selecionado (1 para +, 2 para -, 3 para X e 4 para /). O valor em saved_number é salvo na variável term1 para que a variável saved_number possa ser usada para a segunda metade da equação. O símbolo do operando é impresso na tela junto com a eliminação de quaisquer números no campo de resultados. A única exceção é o quadrado da tela limpa, que redefine todas as variáveis de cálculo e limpa o campo de resultados de qualquer coisa nele.

}outro{

switch (op_num) {

caso 1:

resultado = termo1 + número_ salvo;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (resultado));

pausa;

caso 2:

resultado = termo1 - número_ salvo;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (resultado));

pausa;

caso 3:

resultado = termo1 * número_ guardado;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (resultado));

pausa;

caso 4:

resultado = flutuante (termo1) / flutuante (número salvo);

tft.setCursor (cursorLocX, cursorLocY);

tft.print (resultado);

pausa;

}

tft.setCursor (cursorLocX, cursorLocY);

salvo_numero = resultado;

termo1 = 0;

op_num = 0;

atraso (1000);

}

}

}

A última parte do loop trata do evento em que o usuário seleciona o sinal de igual (user_selection == 10). Outra função de switch funciona por meio das quatro funções matemáticas (determinadas por op_num). O caso de adição (caso 1) adiciona term1 e saved_number juntos e salva o número na variável de resultado. O resultado é impresso no campo de resultados como um duplo. O caso de subtração (caso 2) subtrai o número salvo do termo1 e salva o número na variável de resultado. O resultado é impresso no campo de resultados como um duplo. O caso de multiplicação (caso 3) multiplica term1 por saved_number e salva o número na variável de resultado. O resultado é impresso no campo de resultados como um duplo. O caso de divisão (caso 4) divide o termo1 pelo número salvo e salva o número na variável de resultado. O resultado é impresso no campo de resultados como um float (porque as respostas da divisão podem ser números decimais). Após o evento de um número, operando ou resultado ser impresso na tela, o cursor é redefinido, save_number é definido para o resultado anterior e term1 e op_num são redefinidos.

Algumas observações: o usuário não pode inserir números decimais na calculadora devido à falta de um quadrado decimal. Além disso, o usuário só pode fazer uma equação por vez. Você não pode calcular um resultado e então adicionar / subtrair / multiplicar / dividir esse resultado. Na função numberSelect (), há uma função que limpa a tela depois que um resultado foi impresso, se um usuário pressionou outro quadrado.

Etapa 4: o código: função de quadrados

quadrados vazios () {

// quadrados pretos e brancos alternam em cada linha e a primeira e a terceira linhas têm um padrão oposto do que a segunda e a quarta linhas

tft.fillRect (0, 60, 60, 65, TFT_BLACK); // a primeira linha de quadrados começa, de preto para branco tft.fillRect (60, 60, 60, 65, TFT_WHITE);

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

tft.fillRect (180, 60, 60, 65, TFT_WHITE); // termina a primeira linha de quadrados

tft.fillRect (0, 125, 60, 65, TFT_WHITE); // a segunda linha de quadrados começa, do branco ao preto tft.fillRect (60, 125, 60, 65, TFT_BLACK);

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

tft.fillRect (180, 125, 60, 65, TFT_BLACK); // segunda linha de quadrados termina

tft.fillRect (0, 190, 60, 65, TFT_BLACK); // a terceira linha de quadrados começa, de preto para branco tft.fillRect (60, 190, 60, 65, TFT_WHITE);

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

tft.fillRect (180, 190, 60, 65, TFT_WHITE); // termina a terceira linha de quadrados

tft.fillRect (0, 255, 60, 65, TFT_WHITE); // a quarta linha de quadrados começa, do branco ao preto tft.fillRect (60, 255, 60, 65, TFT_BLACK);

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

tft.fillRect (180, 255, 60, 65, TFT_BLACK); // quarta linha de quadrados termina

}

A função squares () é bastante direta. O comando tft.fillRect (X1, Y1, X2, Y2, TFT_COLOR) desenha um retângulo de acordo com os parâmetros passados a ele, que são as primeiras posições de xey, as segundas posições de xey e a cor com a qual o retângulo é preenchido. Esta função desenha todas as quatro linhas de quadrados (tecnicamente retângulos) e preenche cada quadrado com a cor passada a ele.

Etapa 5: O Código: Função de Números

números vazios () {

tft.setTextColor (TFT_BLUE); // define a cor do número / caractere para azul

tft.setTextSize (5); // define o tamanho do número / caractere para 5

tft.setCursor (18, 75); // define o cursor para a primeira linha de números / caracteres

tft.print ("7 8 9 /"); // imprime a primeira linha de números / caracteres

tft.setCursor (18, 140); // define o cursor para a segunda linha de números / caracteres

tft.print ("4 5 6 X"); // imprime a segunda linha de números / caracteres

tft.setCursor (18, 205); // define o cursor para a terceira linha de números / caracteres

tft.print ("1 2 3 -"); // imprime a terceira linha de números / caracteres

tft.setCursor (18, 270); // define o cursor para a quarta linha de números / caracteres

tft.print ("C 0 = +"); // imprime a quarta linha de números / caracteres

}

A função numbers () também é direta. As primeiras duas linhas aumentam o tamanho do texto e a cor é azul. O comando tft.setCursor () define o cursor para a posição em cada linha de onde começa a escrita dos números. Em seguida, o comando tft.print () imprime os números / caracteres sobre os quadrados.

Etapa 6: O Código: Função NumberSelect

void numberSelect () {

TSPoint p = ts.getPoint ();

pinMode (XM, OUTPUT);

pinMode (YP, OUTPUT);

if (p.z> MINPRESSURE) {

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

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

if (resultado! = 0) {

resultado = 0;

número_alvo = 0;

tft.print ("CLEAR VALUES");

atraso (500);

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

tft.setCursor (cursorLocX, cursorLocY);

}

Para iniciar a função numberSelect (), pedimos a entrada do usuário na tela sensível ao toque com o comando ts.getPoint (). Depois de coletados esses dados, verificamos se a pressão mínima foi ultrapassada (ou, em outras palavras, se o usuário pressionou em algum lugar da tela sensível ao toque). Se for, as coordenadas xey são mapeadas a partir de coordenadas cartesianas para coordenadas específicas da tela sensível ao toque. (0, 0) é o canto superior esquerdo da tela sensível ao toque, com o eixo x passando e o eixo y descendo. A próxima parte verifica se há um número salvo no resultado. Se houver, o resultado e o número salvo são redefinidos para 0. A mensagem "LIMPAR VALORES" é impressa sobre o campo de resultados e a tela é limpa com o cursor de volta à sua posição inicial.

if (p.y 60) {// primeira linha de quadrados

if (p.x <60)

user_selection = 7;

else if (p.x <120)

user_selection = 8;

else if (p.x <180)

user_selection = 9;

senão user_selection = 14;

} else if (p.y 125) {// segunda linha de quadrados

if (p.x <60)

user_selection = 4;

else if (p.x <120)

user_selection = 5;

else if (p.x <180)

user_selection = 6;

senão user_selection = 13;

} else if (p.y 190) {// terceira linha de quadrados

if (p.x <60)

user_selection = 1;

else if (p.x <120)

user_selection = 2;

else if (p.x <180)

user_selection = 3;

senão user_selection = 12;

} else if (p.y> 255) {// quarta linha de quadrados

if (p.x <60)

user_selection = 15;

else if (p.x <120)

user_selection = 0;

else if (p.x <180)

user_selection = 10;

senão user_selection = 11;

}

}outro{

user_selection = 16; // user_selection é definida como 16 (variável nada)

}

}

Esta é a parte que determina qual botão foi selecionado. Começando com a linha superior de quadrados e terminando com a linha inferior, o Arduino procura onde a tela foi realmente pressionada. Em seguida, atribui um número ao quadrado e salva esse número em user_selection. Os números 0-9 correspondem aos quadrados dos números, os números 11-15 correspondem aos quadrados do operando e ao quadrado claro, e o número 10 corresponde ao quadrado do sinal de igual. Se nenhum quadrado foi selecionado, então user_selection é definido como 16, o que fará o loop começar novamente (veja a função de loop).

Etapa 7: Aproveite o seu projeto concluído

Aí está! Agora você tem uma calculadora com tela sensível ao toque que pode fazer adição, subtração, multiplicação e divisão. Este projeto mudou totalmente a maneira como eu pensava que uma calculadora funcionava. Enquanto trabalhava neste projeto, lembro-me de dizer ao meu instrutor na aula: "Nunca mais vou olhar para uma calculadora da mesma maneira!" As funções que você, como usuário, consideram fáceis são um tanto difíceis quando você está atrás do computador tentando emular sua ideia. Espero que tenha gostado do projeto e espero que sua mentalidade de como uma calculadora funciona tenha mudado também!

Aqui está o código completo para sua conveniência. Ele está cheio de comentários, portanto, se você tiver algum problema, eles devem mostrar o que cada linha faz.