Como construir um aplicativo de pintura usando Arduino

Neste projeto, construiremos um aplicativo de pintura no Arduino UNO/Arduino Mega que roda em uma tela sensível ao toque TFT de 3,5 polegadas com base no driver ILI9486. A tela sensível ao toque ILI9486 tem uma resolução de tela de 320×480 pixels. Usando uma caneta, você pode desenhar, pintar e escrever nela (até mesmo com sua própria caligrafia).

Componentes necessários

1. Arduino UNO/Arduino Mega x1
2. S Tela sensível ao toque TFT de 3,5 polegadas (baseada em driver ILI9486) x1

Conexões de circuito
Não há conexões de circuito necessárias para construir este projeto. Basta encaixar o escudo TFT touchscreen no Arduino UNO ou Arduino Mega, alimentando a placa através de um USB ou adaptador de energia. Você também precisará conectar o Arduino ao seu computador usando um cabo USB para carregar o esboço.

O esboço do Arduino
Depois de colocar o módulo touchscreen TFT de 3,5 polegadas no Arduino, carregue o seguinte esboço.

Como funciona

A aplicação de pintura é codificada no firmware do Arduino e é projetada para a resolução de tela do módulo touchscreen TFT de 3,5 polegadas (ou seja, resolução de 320×480 pixels). O aplicativo possui uma paleta de cores de um lado, com o restante da tela livre para pintar, desenhar, colorir ou escrever com a caneta. Este espaço é branco, com sete cores disponíveis na paleta: preto, vermelho, verde, azul, ciano, magenta e amarelo.

É possível escolher cores adicionais definindo constantes com seus respectivos códigos de cores no esboço do Arduino.

Quando o usuário toca a caneta na tela, o aplicativo “lê” os pixels contatados. Se os pixels corresponderem a uma das caixas de cores da paleta, essa cor é selecionada para uso. Se os pixels corresponderem ao espaço de desenho da tela sensível ao toque, os pixels na tela são preenchidos com a cor escolhida.

O raio do pincel para as sete cores está definido como '3' pixels. Você pode alterar isso no esboço para qualquer valor, como '1' ou '5' pixels. O raio do pincel para branco é definido como '10' pixels e é usado como borracha no espaço de desenho.

Resultados
O aplicativo de pintura permite que os usuários escolham uma cor da paleta com a caneta e desenhem dentro do espaço de desenho branco, conforme demonstrado no vídeo a seguir.

Você pode fazer desenhos coloridos neste aplicativo de pintura hospedado no Arduino, como os abaixo.

Você pode esboçar.

Ou você pode escrever com sua própria caligrafia.

O código
O esboço é a base deste projeto Arduino e transforma uma tela sensível ao toque básica interligada ao Arduino em um aplicativo criativo de pintura ou desenho.

O esboço começa importando as bibliotecas Adafruit_GFX.h, MCUFRIEND_kbv.h e TouchScreen.h. As bibliotecas Adafruit_GFX.h e MCUFRIEND_kbv.h permitem que o módulo de exibição TFT funcione. A biblioteca Touchscreen.h é necessária para que as funções de “toque” funcionem na tela por meio da caneta. Isso é seguido pela declaração das constantes de cor e instanciação de um objeto de exibição TFT.

Em seguida, as variáveis ​​são declaradas para a configuração da função touch, e um objeto da classe touchscreen é instanciado. A variável 'BOXSIZE' é definida para definir o tamanho das caixas de cor na paleta. As variáveis ​​são declaradas para o raio da caneta (o tamanho do pincel), a cor anterior e a cor atual.

Na função setup , a tela sensível ao toque é inicializada, redefinida e preenchida com um fundo branco.

As linhas de código a seguir definem e exibem a paleta de cores na tela sensível ao toque.

tft.fillRect(0, 0, TAMANHODACAIXA, TAMANHODACAIXA, AMARELO);
tft.fillRect(BOXSIZE, 0, BOXSIZE, BOXSIZE, MAGENTA);
tft.fillRect(TAMANHODACAIXA * 2, 0, TAMANHODACAIXA, TAMANHODACAIXA, CIANO);
tft.fillRect(BOXSIZE * 3, 0, BOXSIZE, BOXSIZE, VERDE);
tft.fillRect(TAMANHODACAIXA * 4, 0, TAMANHODACAIXA, TAMANHODACAIXA, VERMELHO);
tft.fillRect(BOXSIZE * 5, 0, BOXSIZE, BOXSIZE, AZUL);
tft.fillRect(TAMANHODACAIXA * 6, 0, TAMANHODACAIXA, TAMANHODACAIXA, PRETO);
tft.fillRect(BOXSIZE * 7, 0, BOXSIZE, BOXSIZE, BRANCO);
tft.drawRect(TAMANHODACAIXA * 7, 0, TAMANHODACAIXA, TAMANHODACAIXA, PRETO);

A cor atual é definida como 'Amarelo' e o GPIO13 se conecta ao pino SCK da tela sensível ao toque e é definido como uma saída digital. Em seguida, as constantes são declaradas para a pressão mínima e máxima da caneta.

A cor atual é definida como ‘Amarelo’ e o GPIO13 se conecta ao pino SCK da tela sensível ao toque e é definido como uma saída digital. A seguir, são declaradas as constantes para a pressão mínima e máxima da ponta.

Na função loop , o código abaixo é usado para “sentir” os pixels da tela que a caneta toca.

digitalWrite(13, ALTO);
TSPoint p = ts.getPoint ;
digitalWrite(13, BAIXO);
pinMode(XM, SAÍDA);
pinMode(YP, SAÍDA);
se (pz > PRESSÃO MÍNIMA && pz < PRESSÃO MÁXIMA) {
se (py < (TS_MINY – 5)) {
Serial.println(“apagar”);
tft.fillRect(0, TAMANHODACAIXA, tft.largura , tft.altura – TAMANHODACAIXA, BRANCO);
}
px = mapa(px, TS_MINX, TS_MAXX, tft.width , 0);
py = mapa(py, TS_MINY, TS_MAXY, tft.height , 0);

Se um ponto tocado na tela corresponder a uma caixa da paleta de cores, a respectiva cor será selecionada.

se (py < 0) {
cor antiga = cor atual;
se (px < TAMANHODACAIXA) {
cor atual = AMARELO;
tft.drawRect(0, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
} senão se (px < BOXSIZE * 2) {
cor atual = MAGENTA;
tft.drawRect(TAMANHODACAIXA, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
} else if (px
coratual = CIANO;
tft.drawRect(TAMANHODACAIXA * 2, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
} senão se (px < BOXSIZE * 4) {
cor atual = VERDE;
tft.drawRect(TAMANHODACAIXA * 3, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
} senão se (px < BOXSIZE * 5) {
coratual = VERMELHO;

tft.drawRect(BOXSIZE * 4, 0, BOXSIZE, BOXSIZE, BRANCO);
} senão se (px < BOXSIZE * 6) {

cor atual = AZUL;
tft.drawRect(TAMANHODACAIXA * 5, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
}senão se (px < BOXSIZE * 7) {
cor atual = PRETO;
tft.drawRect(BOXSIZE * 6, 0, BOXSIZE, BOXSIZE, BRANCO);
}senão se (px < BOXSIZE * 8) {
coratual = BRANCO;
tft.drawRect(BOXSIZE * 7, 0, BOXSIZE, BOXSIZE, PRETO);
}

Sempre que um usuário seleciona uma cor diferente, a borda branca ao redor da cor anterior na paleta de cores é removida.

se (corantiga != coratual) {
if (oldcolor == AMARELO) tft.fillRect(0, 0, BOXSIZE, BOXSIZE, YELLOW);
if (oldcolor == MAGENTA) tft.fillRect(BOXSIZE, 0, BOXSIZE, BOXSIZE, MAGENTA);
se (oldcolor == CIANO) tft.fillRect(TAMANHODACAIXA * 2, 0, TAMANHODACAIXA, TAMANHODACAIXA, CIANO);
se (oldcolor == VERDE) tft.fillRect(TAMANHODACAIXA * 3, 0, TAMANHODACAIXA, TAMANHODACAIXA, VERDE);
se (oldcolor == VERMELHO) tft.fillRect(TAMANHODACAIXA * 4, 0, TAMANHODACAIXA, TAMANHODACAIXA, VERMELHO);
se (oldcolor == AZUL) tft.fillRect(TAMANHODACAIXA * 5, 0, TAMANHODACAIXA, TAMANHODACAIXA, AZUL);
se (oldcolor == BLACK) tft.fillRect(TAMANHODACAIXA * 6, 0, TAMANHODACAIXA, TAMANHODACAIXA, BLACK);
se (oldcolor == BRANCO) tft.fillRect(TAMANHODACAIXA * 7, 0, TAMANHODACAIXA, TAMANHODACAIXA, BRANCO);
}

Se uma cor diferente de branco for selecionada e a caneta tocar o espaço de desenho, o pixel tocado mudará para a mesma cor. O raio do pincel para cores permanece em '3' pixels.

No entanto, pode ser definido para qualquer valor – como '1' ou '5' pixels conforme desejado. Quanto menor o tamanho do pixel do pincel, mais detalhada será a pintura ou desenho no espaço de desenho.

se ((py > 5) && (py < tft.height ) && coratual != BRANCO) {
PENRÁDIO = 3;
tft.fillCircle((px-PENRADIUS), (p.y+BOXSIZE) , PENRADIUS, cor atual);
}

Se a cor escolhida for branco, o raio do pincel será definido como '10' pixels, e o branco será usado para apagar a pintura ou desenho atual na tela.

if ((py > 5) && (py
PENRÁDIO = 10;
tft.fillCircle((px-PENRADIUS), (p.y+BOXSIZE) , PENRADIUS, cor atual);
}