Display LCD Nokia 5110 – Imprimindo uma imagem

No último tutorial vimos como fazemos para imprimir textos e desenhos no display LCD Nokia 5110 usando as bibliotecas LCD5110_Basic.h e LCD5110_Graph.h . Nesse tutorial faremos algo ainda mais interessante. Iremos aprender a imprimir uma imagem em nosso display usando uma função da biblioteca LCD5110_Graph.h.

Para o melhor aproveitamento desse tutorial é importante que você já tenha lido o tutorial anterior sobre o Display LCD Nokia 5110.

[toc]

---

Exemplo 3 – Imprimindo uma imagem no display Nokia 5110

Componentes necessários

Para este exemplo, utilizaremos:

• Placa Arduino UNO  ou similar
• Módulo display Nokia 5110 (Azul ou Vermelho)
• Fios jumper’s
• Protoboard
• Resistores
• 1 Imagem

Montando o projeto

O circuito desse exemplo é o mesmo do exemplo 1 do tutorial Display LCD Nokia 5110 – Aprenda como utilizá-lo com seu Arduino.

Para o display de placa azul que opera a 5V teremos o seguinte esquema:

Abaixo a tabela com as pinagens:

Pino	Resistor	Arduino	Cor
1 – RST	–	Pino 12	Amarelo
2 – CE	–	Pino 11	Verde
3 – DC	–	Pino 10	Azul
4 – DIN	–	Pino 9	Laranja
5 – CLK	–	Pino 8	Roxo
6 – VCC	–	5v	Vermelho
7 – LIGHT	220R	5v	Vermelho
8 – GND	–	GND	Preto

Para o display de placa vermelha que opera a 3.3V, precisamos colocar resistores de 10k Ohm nas entradas de sinal uma vez que a saída do Arduino UNO é de 5V. Nesse caso, teremos uma queda de tensão no resistor, diminuindo a tensão que chegará ao módulo.

Veja o esquema:

Abaixo a tabela com as pinagens:

Pino	Resistor	Arduino	Cor
1 – RST	10K	Pino 12	Amarelo
2 – CE	10K	Pino 11	Verde
3 – DC	10K	Pino 10	Azul
4 – DIN	10K	Pino 9	Laranja
5 – CLK	10K	Pino 8	Roxo
6 – VCC	–	3.3v	Vermelho
7 – LIGHT	220R	GND	Marrom
8 – GND	–	GND	Preto

Nota: Caso o LCD 5110 de placa vermelha seja utilizado com um Arduino Due não será necessário o uso dos resistores de 10K pois suas portas operam a 3.3V!

Arduino Uno com display placa azul

Conectando o Arduino ao computador

Conecte seu Arduino ao computador e abra a IDE Arduino.

Antes de carregar um programa, você precisa selecionar qual porta você deseja usar para fazer carregar o programa no Arduino (upload). Dentro do Arduino IDE, clique no menu Ferramentas (tools) e abra o submenu Porta(Port). Clique na porta que seu Arduino está conectado, tal como COM3 ou COM4. Geralmente aparece o nome da placa Arduino : “COM3 (Arduino/Genuino Uno)”.

Você também precisa garantir que o tipo de placa apropriado está selecionado em Ferramentas(Tools) no submenu Placa (Board).

Preparando a Imagem

Neste exemplo iremos movimentar uma imagem na tela. Para que uma imagem seja exibida na tela do LCD 5110 será necessário convertê-la para uma arranjo de caracteres hexadecimais, formato suportado pela biblioteca e a tela. Além disso é necessário ajustar as dimensões da imagem para seja igual ou menor que as dimensões da tela (84×48 pixels).

Vamos utilizar esta imagem:

Para editar a imagem usaremos o editor de imagens GIMP que é gratuito e está disponível aqui. Você pode utilizar qualquer outro editor de imagens.

Abra a imagem com o GIMP, vá no menu Imagem e clique em “Redimensionar imagem”

Na janela seguinte coloque o valor 48 para altura e automaticamente ele ajustará a largura para 63. Clique em Redimensionar e a imagem estará com as dimensões ideais para o display.

Depois vá no menu Imagem, clique em “Modo” e em seguida “Indexado…”

Na janela a seguir selecione “Usar paleta preto e branco (1 Bit) e clique em “Converter”

Agora clique no menu Arquivo, vá em “Exportar como”, selecione o formato “Imagem BMP do Windows”, defina um nome(para o exemplo usaremos “vidadesilicio.bmp”) e clique em “Exportar”O resultado será essa imagem:

Agora vamos utilizar o programa LCD Assistant para converter nossa imagem em um arranjo hexadecimal. Para baixa-lo clique aqui.

 

Abra o programa clique em “File” e em seguida “Load image” e abra a imagem “vidadesilicio.bmp”.

Clique novamente em “File” e clique na opção “Save output”. Salve com o nome “vidadesilicio.c” dentro da pasta exemplo 3.

 

Programando

Crie um programa (sketch) e salve com o nome de “modulo_5110_ex3”. Com o seu programa salvo, adicione a biblioteca LCD5110_Graph.h

Para baixar as bibliotecas clique aqui. Depois adicione ela à sua IDE Arduino

Para saber como incluir uma biblioteca na IDE Arduino, visite o post Sensores DHT e Uso de Bibliotecas.

Em seguida, insira nele o código conforme escrito abaixo:

#include <LCD5110_Graph.h>

LCD5110 tela(8,9,10,12,11);

//O arranjo gerado pelo programa terá o mesmo nome da imagem
extern uint8_t vidadesilicio[]; //Obtendo o arranjo

void setup()
{
 tela.InitLCD();
}

void loop()
{
 for (int i=0; i<=160; i++) //laço necessário para o carrinho percorrer a tela toda
 {
 tela.clrScr(); //limpando a tela e o buffer
 tela.drawBitmap(i-63, 0, vidadesilicio, 63, 48); //desenhando a imagem na tela
 tela.update(); //atualizando a tela com as informações armazenadas no buffer
 delay(100); //Aumentando esse tempo a velocidade diminuirá,
 //diminuindo-o a velocidade aumentará
 }
}

Após escrever o código, clique em Carregar (Upload) para que o programa seja transferido para seu Arduino.

Colocando para funcionar

Se tudo deu certo, o resultado deve ser o mesmo apresentado abaixo:

---

Entendendo a fundo

Entendendo o Software

Para imprimir a imagem no display, utilizamos duas funções, são elas:

drawBitmap(coluna, linha, bitmap, largura, altura)

Esta função desenha na tela um bitmap que deve ser previamente definido como um array hexadecimal. Os valores de coluna e linha definirão em que posição a imagem será desenhada na tela. Os valores de altura e largura correspondem ao tamanho da imagem. Os valores máximos são 84 para largura e 48 para altura.

tela.drawBitmap(coluna, linha, nome da imagem, largura, altura); //desenhando a imagem na tela

Você pode encontrar ela em nosso programa tal como apresentado abaixo. Note que a coluna está em função da variável i, usada no for, e por isso a imagem se mexe na tela.

tela.drawBitmap(i-63, 0, vidadesilicio, 63, 48); //desenhando a imagem na tela

update()

Esta função serve para atualizar a tela, ela será necessária toda vez que alguma alteração na tela seja feita.

tela.update(); //atualizando a tela com as informações armazenadas no buffer

Desafio

1. Utilizando o sensor ultrassom HC-SR04 modifique o código do exemplo 3 para que o carrinho pare na tela sempre que a distância for menor que 10cm. Caso a distância seja maior ou igual a 10cm ele deverá continuar andando.

Fechamento

Esperamos que tenham gostado, deixe seu comentário com duvidas, sugestões ou com a foto ou vídeo de seu projeto!! Compartilhe à vontade.

Revisado por Ícaro Lobo e editado por Allan Mota