Olá, tudo bem? No post de hoje vamos aprender como utilizar o Display Nokia 5110 com Arduino. A partir de agora, partiremos para a utilização de um display muito mais interativo com o usuário, com melhores definições e com uma estética mais agradável. Preparado?
Por que utilizar o display Nokia 5110?
Até o momento, trabalhamos em nossos projetos apenas com o display LCD 16×2. Nada contra, porém ele tem suas limitações. Dessa forma, é preciso buscar novas ferramentas gráficas para melhorar essa interação homem x máquina. Com o nosso display Nokia 5110, podemos ter essa melhoria que procuramos. Além disso, foi nessa tela que surgiu o lendário “jogo da cobrinha”, chamado de ‘Snake‘. Lembra dele?
Então, foi aproveitando a onda da criação de módulos para o Arduino, que se decidiu reviver essas telas e adaptá-las ao Arduino. Dessa forma, buscaremos hoje trazer o exemplo de aplicação para essa telinha e nos próximos posts, aprofundar sobre as possibilidades de sua utilização!
Hardware do Display 5110
Vamos agora estudar o hardware de nosso display. Ele possui uma resolução interessante de 84×48 pixels. Ou seja, é possível desenhar com uma boa compreensão em nosso display, mas obviamente a resolução não será a mesma comparada a um computador.
Fonte: AutoCore Robótica
Agora, observe bem a cor de seu display. Pois normalmente, os módulos azuis, como na imagem, trabalham em tensões de 5V e 3.3V. Contudo, os displays na cor vermelha, certamente é 3.3V, operando desde 2.7V.
Já o seu consumo, ele fica inferior a 20mA, então podemos ligar tranquilamente ele diretamente ao 3.3V do Arduino. Combinado? Para finalizar esse tópico, caso queira alguma informação mais detalhada, basta visualizar o Datasheet do Display 5110 clicando na imagem abaixo:
Componentes do Projeto
Vamos agora iniciar a construção de nosso projeto. Para isso, separe os seguintes componentes:
Montagem do Circuito
A partir de agora, vamos iniciar a montagem do nosso circuito de hoje. Para isso, coloque eles na protoboard igual está na imagem abaixo do circuito!
Fonte: AutoCore Robótica
Código do Projeto Comentado
Espere um pouco, pois antes de apresentar o código de nosso projeto de hoje, será preciso baixar a biblioteca do nosso display. Para realizar o seu download, basta clicar na imagem abaixo e instalar a biblioteca através da IDE.
/* ========================================================================================================
Projeto: Desenhando no Display Nokia 5110
**Código modificado da Adafruit**
Data: 23/05/2019
Todos os Direitos reservados.
// ==================================================================================================*/
#include <Adafruit_GFX.h> // Biblioteca para utilizar as fontes
#include <Adafruit_PCD8544.h> // Biblioteca para utilizar os comandos do Display
Adafruit_PCD8544 display = Adafruit_PCD8544(8, 9, 10, 11, 12); // Criando o construtor e passando a pinagem dele
// pin 8 - Serial clock out (SCLK)
// pin 9 - Serial data out (DIN)
// pin 10 - Data/Command select (D/C)
// pin 11 - LCD chip select (CS)
// pin 12 - LCD reset (RST)
void setup() {
// Icializando o Display
display.begin();
// Aqui estamos definindo o valor do contraste que pode variar entre 0-127
display.setContrast(55);
// Limpa todo o display
display.clearDisplay();
// Escreve no Display
display.setTextSize(2); // Tamanho da Fonte
display.setTextColor(BLACK); // Cor da Fonte
display.setCursor(((display.width() / 2) - 25), ((display.height() / 2) - 16)); // Posição no Display onde vamos escrever
display.println("AUTO"); // Texto que será escrito
display.display();
delay(500);
// Invertendo texto no Display
display.setTextColor(WHITE, BLACK); // Comando para inverter a cor da Fonte (Preto --> Branco)
display.setCursor(((display.width() / 2) - 25), display.height() / 2);
display.println("CORE");
display.display();
delay(2000);
display.clearDisplay();
// ==== ESCREVENDO ARDUINO =====
display.setTextColor(BLACK); // Cor da Fonte
display.setCursor(((display.width() / 2) - 20), (display.height() / 2) - 15); // Posição de inicio para escrever
display.drawLine(((display.width() / 2) - 20), (display.height() / 2) - 17, ((display.width() / 2) + 19), (display.height() / 2) - 17, BLACK); // Desenhando a 1º linha
display.display();
display.setTextSize(1); // Tamanho da fonte
display.println("ARDUINO");
display.drawLine(((display.width() / 2) - 20), (display.height() / 2) - 7, ((display.width() / 2) + 19), (display.height() / 2) - 7, BLACK); // Desenhando a 2º Linha
display.display();
// Escrevendo Caracteres da Tabela ASCII
display.setCursor(((display.width() / 2) - 9), (display.height() / 2) - 4);
display.setTextSize(3);
display.write(3); // escrevendo o caractere número (3) da tabela
display.display();
delay(2000);
display.clearDisplay();
// ==== ESCREVENDO ROBÓTICA ===
display.setTextColor(BLACK);
display.setCursor(((display.width() / 2) - 25), (display.height() / 2) - 15);
display.drawLine(((display.width() / 2) - 25), (display.height() / 2) - 17, ((display.width() / 2) + 25), (display.height() / 2) - 17, BLACK);
display.display();
display.setTextSize(1); // Tamanho da fonte
display.println("ROBOTICA");
display.drawLine(((display.width() / 2) - 25), (display.height() / 2) - 7, ((display.width() / 2) + 25), (display.height() / 2) - 7, BLACK);
display.display();
// Escrevendo Caracteres da Tabela ASCII
display.setCursor(((display.width() / 2) - 9), (display.height() / 2) - 5);
display.setTextSize(3);
display.write(3); // escrevendo o caractere número (3) da tabela
display.display();
delay(2000);
display.clearDisplay();
// ==== ESCREVENDO 'E' ====
display.setTextColor(BLACK);
display.setCursor(((display.width() / 2) - 10), (display.height() / 2) - 15);
display.setTextSize(3); // Tamanho da fonte
display.println("E");
display.display();
delay(1000);
display.clearDisplay();
// ==== ESCREVENDO MUITO MAIS ====
display.setTextColor(BLACK);
display.setCursor(((display.width() / 2) - 30), (display.height() / 2) - 15);
display.drawLine(((display.width() / 2) - 30), (display.height() / 2) - 17, ((display.width() / 2) + 30), (display.height() / 2) - 17, BLACK);
display.display();
display.setTextSize(1); // Tamanho da fonte
display.println("MUITO MAIS");
display.drawLine(((display.width() / 2) - 30), (display.height() / 2) - 7, ((display.width() / 2) + 30), (display.height() / 2) - 7, BLACK);
display.display();
// Escrevendo Caracteres da Tabela ASCII
display.setCursor(((display.width() / 2) - 9), (display.height() / 2) - 5);
display.setTextSize(3);
display.write(3); // escrevendo o caractere número (3) da tabela
display.display();
delay(2000);
display.clearDisplay();
}
void loop() {}
// ============================== FIM ===================================
Analisando o Código a Fundo
Analisando o nosso código, podemos observar que ele inicia com um construtor, ou seja, uma função que irá receber parâmetros (sejam eles letras ou números), no nosso caso, o nosso construtor Adafruit vai receber a pinagem de nosso display, seguindo a ordem abaixo:
Adafruit_PCD8544 display = Adafruit_PCD8544(8, 9, 10, 11, 12); // Criando o construtor e passando a pinagem dele // pin 8 - Serial clock out (SCLK) // pin 9 - Serial data out (DIN) // pin 10 - Data/Command select (D/C) // pin 11 - LCD chip select (CS) // pin 12 - LCD reset (RST)
Logo depois, entrando em nosso void setup(), observe que utilizamos a função display.setContrast(). Ela tem a função de setar o nosso display com um contraste já definido.
display.setContrast(50);
Essa função, precisa ser chamada antes de qualquer outra função da classe ‘tela‘. Sobre o valor do contraste, caso nenhum valor seja informado será usada o valor padrão que é igual a 70. E este valor, pode ser definido de 0 a 127.
Logo em seguida, escrevemos na tela utilizando os seguintes comandos:
// Escreve no Display
display.setTextSize(2); // Tamanho da Fonte
display.setTextColor(BLACK); // Cor da Fonte
display.setCursor(((display.width() / 2) - 25), ((display.height() / 2) - 16)); // Posição no Display onde vamos escrever
display.println("AUTO"); // Texto que será escrito
Neste bloco de código, temos o comando display.setTextSize(), a qual vai configurar o tamanho da nossa fonte. Outro comando que aparece é o display.setTextColor(), comando onde passamos qual será a cor de nossa fonte.
Já o comando displaysetCursor(), segue a mesma lógica dos display de LCD, onde vamos passar pra ele, a posição do ponteiro no display. Por fim, temos o comando display.println(“texto”), o qual vai escrever na tela o texto que se encontra entre os parenteses.
Para finalizar a nossa análise do código, vamos falar de mais um comando, com este comando foi possível desenhar as linhas, observe:
display.drawLine();
Este comando, tem como função, desenhar linhas. Os parâmetros que ele irá receber são (x1,y1,x2,y2,COR DA FONTE). Dessa forma, é preciso ter as coordenadas inicial e final para que ele “ligue os pontos”. Show?
Em nosso próximo post, vou abordar o “Efeito scroll” e como transferir imagens para o nosso display! Então caso não saiba o que seja “Efeito Scroll”, basta clicar no link abaixo onde eu explico esse efeito utilizando um Display LCD. Combinado?
Resultado do Projeto
Por fim, deixo o vídeo que temos no nosso canal do Youtube onde mostra o funcionamento do nosso projeto de hoje!
Mas e ai? Gostou do post? Caso tenha ficado algo incompleto para você, comenta abaixo
Dicas?
Forte abraço!
