EX31 - Programação Arduino com "Display Touch Arduino Shield": Calculadora Retrô

    Para utilizar o Display Touch Arduino Shield, vamos precisar das bibliotecas: Adafruit_GFX, Adafruit_TFTLCD e Touchscreen. As bibliotecas estão disponíveis neste link. Faça o download, descompacte o arquivo e coloque as bibliotecas dentro da pasta LIBRARIES da IDE do seu Arduino. Reinicie a IDE para que as bibliotecas sejam corretamente carregadas, depois basta incluir no código conforme mostrado abaixo.  

#include <Adafruit_GFX.h> // Biblioteca gráfica principal
#include <Adafruit_TFTLCD.h> // Biblioteca específica de hardware
#include <TouchScreen.h> // Biblioteca específica do TouchScreen

    Precisamos calibrar a tela LCD para que funcione conforme o esperado, os valores fornecidos aqui são quase universais. As variáveis ​​TS_MINX, TS_MINY, TS_MAXX e TS_MAXY decidem a calibração da Tela. Você pode alterar eles se achar que a calibração não é satisfatória.

# define TS_MINX 150
# define TS_MINY 120
# define TS_MAXX 920
# define TS_MAXY 940

    A tela LCD TFT pode exibir muitas cores, todas essas cores devem ser inseridas em valores hexadecimais. Para torná-lo mais legível, atribuímos esses valores a uma variável conforme mostrado abaixo.

# define Black    0x0000 // Preto
# define Blue     0x001F // Azul
# define Red      0xF800 // Vermelho
# define Green    0x07E0 // Verde
# define Cyan     0x07FF // Ciano
# define Pink     0xF81F // Rosa
# define Yellow   0xFFE0 // Amarelo
# define White    0xFFFF // Branco

    A comunicação da tela touch resistiva  LCD TFT deve ser definida, para isto atribuímos a função e endereços dos pinos conforme mostrado abaixo.

#define YP A3  // 
#define XM A2  // 
#define YM 9   //
#define XP 8   //

     O controle do display da tela LCD TFT deve ser definida, para isto atribuímos o endereços dos pinos conforme mostrado abaixo:

Adafruit_TFTLCD tft (A3, A2, A1, A0, A4);

Programação Arduino com "Display Touch Arduino Shield": Calculadora Retrô

Figura 01 -  Teclado da
"Calculadora Retrô"

    Para teste do "Display Touch Arduino Shield", desenvolvi a aplicação "Calculadora Retrô" que está disponível no link após a descrição de cada etapa desenvolvida.

    Vamos projetar a interface do usuário da calculadora. Fiz um layout básico da calculadora com 16 botões e uma unidade de exibição, para construir fiz inicialmente o rascuno do design, mostrado na figura 04. As bibliotecas adicionadas permitirão que você desenhe linhas, retângulo, círculos, caracteres, e muito mais de qualquer cor preferida. Você pode entender as funções disponíveis neste artigo. 

    Usei as habilidades de desenho de linha e caixa para projetar a calculadora que se parece muito com a calculadora dos anos 90. Cada caixa tem largura e altura de 60 pixels, conforme mostrado na figura 04.

    Após o esboço e teste da programação que está mostrado abaixo, temos o resultado final mostrado na figura 03.

  Foi inicialmente desenhado a caixa de resultados acima, as colunas com números na cor preto e caracteres brancos, os caracteres dos operandos também foram desenhados em branco, porém com caixa azul.

//Draw the Result Box
  tft.fillRect(0, 0, 240, 80, WHITE);
//Draw First Column
  tft.fillRect  (0,260,60,60,BLUE);
  tft.fillRect  (0,200,60,60,BLACK);
  tft.fillRect  (0,140,60,60,BLACK);
  tft.fillRect  (0,80,60,60,BLACK);
//Draw Third Column 
  tft.fillRect  (120,260,60,60,BLUE);
  tft.fillRect  (120,200,60,60,BLACK);
  tft.fillRect  (120,140,60,60,BLACK);
  tft.fillRect  (120,80,60,60,BLACK);
//Draw Secound & Fourth Column 
  for (int b=260; b>=80; b-=60)
 { tft.fillRect  (180,b,60,60,BLUE);
   tft.fillRect  (60,b,60,60,BLACK);}
//Draw Horizontal Lines
  for (int h=80; h<=320; h+=60)
  tft.drawFastHLine(0, h, 240, WHITE);
//Draw Vertical Lines
  for (int v=0; v<=240; v+=60)
  tft.drawFastVLine(v, 80, 240, WHITE);
//Display keypad lables
  for (int j=0;j<4;j++) {
    for (int i=0;i<4;i++) {
      tft.setCursor(22 + (60*i), 100 + (60*j));
      tft.setTextSize(3);
      tft.setTextColor(WHITE);
      tft.println(symbol[j][i]);

Figura 02 -  Esboço do telado da
"Calculadora Retrô"

    Detectando os botões: Outra tarefa desafiadora é detectar o toque do usuário . Cada vez que o usuário toca em algum lugar, podemos ver onde estão as posições X e Y do pixel que ele tocou. Este valor pode ser exibido no monitor serial usando o println conforme mostrado abaixo. 

    Pois desenhamos a caixa com largura e altura de 60 pixels cada e temos quatro Linhas e para colunas a partir de (0,0). A posição de cada caixa pode ser prevista conforme mostrado na imagem da figura 04.

    Agora, já que sabemos a posição de todas as caixas. Quando um usuário toca em qualquer lugar, podemos prever onde ele tocou, comparando seus valores (X, Y) com o valor de cada caixa, conforme mostrado abaixo.

if (X<105 && X>50) //Detecting Buttons on Column 2
  { if (Y>0 && Y<85)
    {Serial.println ("Button 0"); //Button 0 is Pressed
    if (Number==0)
    Number=0;
    else
    Number = (Number*10) + 0; //Pressed twice
    } if (Y>85 && Y<140)
    {Serial.println ("Button 2");
     if (Number==0)
    Number=2;
    else
    Number = (Number*10) + 2; //Pressed twice
    }

    A etapa final é calcular o resultado e exibi-los na tela LCD TFT. Esta calculadora Arduino pode realizar operações com apenas 2 números. Esses dois números são nomeados como variáveis ​​“Num1” e “Num2”. A variável “Número” fornece e obtém valor de Num1 e Num2 e também carrega o resultado.

    Quando um usuário pressiona um botão, um dígito é adicionado ao número. Quando outro botão é pressionado, o dígito anterior é multiplicado por 10 e o novo número é adicionado com ele. Por exemplo, se pressionarmos 8 e, em seguida, pressionarmos 5 e, em seguida, pressionarmos 7. Então, primeiro a variável manterá 8, então (8 * 10) + 5 = 85, então (85 * 10) +7 = 857. Então, finalmente, a variável terá o valor 857 com ele.

if (Y>192 && Y<245)
    {Serial.println ("Button 8");
     if (Number==0)
    Number=8;
    else
    Number = (Number*10) + 8; //Pressed again
    }  

    Quando realizamos qualquer operação como adição, quando o usuário pressiona o botão de adição, o valor do Número será transferido para Num1 e o Número será zerado para que fique pronto para receber a entrada do segundo número.

Figura 03 -  "Calculadora Retrô"

    Ao pressionar Igualdade o valor em Número será enviado para Num2 e então o respectivo cálculo (neste caso a adição) será feito e o resultado será armazenado novamente na variável “Número”.

    O funcionamento desta calculadora da tela de toque do Arduino é simples. Você deve fazer o upload do código fornecido abaixo em seu Arduino e ativá-lo. A calculadora é exibida na tela LCD.

    Agora, você pode inserir qualquer número e realizar seus cálculos. Ele está limitado a apenas dois operandos e apenas um operador, por enquanto. Mas, você pode ajustar o código para torná-lo mais prático. Você deve pressionar “C” para limpar o valor na tela todas as vezes após realizar um cálculo. Espero que você tenha entendido o projeto e gostado de construir algo semelhante.

Código da "Calculadora Retrô" do "Display Touch Arduino Shield" está disponível em: 21_03_01_"Calculadora_Retrô"_com_"Display_Touch_Arduino_Shield".

© Direitos de autor. 2020: Gomes; Sinésio Raimundo. Última atualização: 02/03/2021