Você está na página 1de 68

Biblioteca Gráfica Microchip

em Displays do tipo TFT


(QVG)

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 1


Objetivos

Depois de assistir esta aula, os participantes serão


capazes de ...
Compreender a arquitetura do hardware e de firmware
entre um microcontrolador PIC® e um display LCD
gráfico

Utilizar um display gráfico como uma interface de


entrada através de uma tela sensível ao toque (interface
humana)

Especificar ferramentas e softwares adequados para a


criação de projetos gráficos embarcados

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 2


Agenda

Aplicações
Selecionando o display
Conexão display\microcontrolador
Software – Microchip Graphics Library
Recursos adicionais
Perguntas

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 3


Aplicações

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 4


Displays fazem parte do nosso
cotidiano!

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 5


Interface Humana

Fácil e Intuitivo = Valor agregado

Um dispositivo complexo pode ser tornar simples com uma boa


interface de usuário

O custo de um display nunca foi tão acessível

Esta aula concentra-se no display LCD não-segmentado;


especificamente o tipo TFT aplicado em dispositivos embarcados.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 6


O que preciso saber ao começar
meu projeto?
Selecionar o display

Conectá-lo ao
microcontrolador

Software

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 7


Selecionando o display

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 8


Indo as compras…
Parte 1

Vocês trabalham com


displays gráficos?

“Trabalhamos com um display


colorido de 3,5”, QVGA e com
backlight.“

O que isto significa !?


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 9
“Traduzindo”

Colorido
No sentido mais simples, pode-se pensar nisso como qualquer um "preto
e branco 'ou' colorido '. Mas há mais do que isso, descobriremos mais
tarde.

3.5
Refere-se simplesmente ao tamanho da tela, semelhante ao comprar uma
TV. Existem diversos tamanhos. Quanto maior a tela melhor será a
visualização a distância; evidentemente também mais caro.

QVGA
Acrônimo para tela com resolução de 320 × 240 pixels. Similar a uma
câmera digital, quanto maior o número de pixels maior os detalhes da
imagem.

LED backlight
Fonte de luz na parte de trás do dispositivo; sem ela você não seria capaz
de enxergar uma imagem em um display TFT.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 10


Nível de cor - Bits Per Pixel

1-bpp
2-bpp

RGB

Consulte http://en.wikipedia.org/wiki/RGB_color_model e conheça mais a


respeito do padrão RGB.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 11


Padrão RGB
Definição
O padrão RGB é um modelo aditivo no qual as cores verde,
vermelho e azul são somadas de várias maneiras para reproduzir
uma gama de colorações. As cores são expressas como um trio.
Fonte: Wikipedia

Cada componente representa a intensidade


www.colorschemer.com possui uma ferramenta gratuíta para
obtenção dos valores RGB

16-bit 18-bit
(65,536 cores) (262,144 cores)
Red: 5 bits Red: 6 bits
Green: 6 bits Green: 6 bits
Blue: 5 bits Blue: 6 bits
RGB 565 RGB 666

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 12


Nível de cores - Exemplos
Definition:
Definition

1 bpp 4 bpp 8 bpp 16 bpp

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 13


“Traduzindo”

Color
No sentido mais simples, pode-se pensar nisso como qualquer um "preto
e branco 'ou' colorido '. Mas há mais do que isso, descobriremos mais
tarde.

3.5
Refere-se simplesmente ao tamanho da tela, semelhante ao comprar uma
TV. Existem diversos tamanhos. Quanto maior a tela melhor será a
visualização a distância; evidentemente também mais caro.

QVGA
Acrônimo para tela com resolução de 320 × 240 pixels. Similar a uma
câmera digital, quanto maior o número de pixels maior os detalhes da
imagem.

Backlight
Fonte de luz na parte de trás do dispositivo; sem ela você não seria capaz
de enxergar uma imagem em um display TFT.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 14


Tamanho e Resolução
320 pixels 320 pixels
240 pixels

s
da

240 pixels
leg
a
as
d
ga
po
3.5 QVGA le
p o
5.7
QVGA

Distância de visão
640 pixels

Detalhes da imagem
480 pixels

das
le ga
p o
5.7
VGA

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 15


Quiz

P: Qual é a resolução WQVGA?


480 x 272 ?
480 x 247 ?
432 x 240 ?
400 x 234 ?

R: Sempre especificar a resolução explicitamente com


técnicos, fornecedores, clientes, etc (ou seja, 480 x
272). Nomes de referência são ambíguos (ou seja,
WQVGA).

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 16


“Traduzindo”

Color
No sentido mais simples, pode-se pensar nisso como qualquer um "preto
e branco 'ou' colorido '. Mas há mais do que isso, descobriremos mais
tarde.

3.5
Refere-se simplesmente ao tamanho da tela, semelhante ao comprar uma
TV. Existem diversos tamanhos. Quanto maior a tela melhor será a
visualização a distância; evidentemente também mais caro.

QVGA
Acrônimo para tela com resolução de 320 × 240 pixels. Similar a uma
câmera digital, quanto maior o número de pixels maior os detalhes da
imagem.

Backlight
Fonte de luz na parte de trás do dispositivo; sem ela você não seria capaz
de enxergar uma imagem em um display TFT.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 17


Luz – Como vemos imagens

A luz incide em nosso globo


ocular
Fontes de luz p\ displays
Transmissiva(backlight)

Refletiva

Transfletiva

Auto-luminosa (OLED)
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 18
Backlight - O que realmente importa?

Muitos tipos:
LED, CCFL, etc.
http://en.wikipedia.org/wiki/Backlight
O que importa para o desenvolvedor:
Alimentação
Interno vs. Externo
Contraste (quanto maior melhor)
Brilho (cd/m2 ou unidades de potência)
Vida útil (horas)
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 19
Indo as compras…
Parte 2
“O que você está procurando?”

“Um display 3.5 com resolução


de 320×240, nível de cor mínimo
de 16-bpp, e com backlight tipo
LED.”

“Por aqui por favor…”

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 20


Conexão
display\microcontrolador

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 21


Conexão - Tópicos

Interface

Mapeamento de cores

Inicializando o controlador

Touch Screen Interface


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 22
Arquitetura de um sistema
embarcado com display

Vidro
Controlador
Frame Buffer
Microcontrolador
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 23
Frame Buffer

O frame buffer armazena as informações de cor para


cada pixel.

Examplo: Um display 320x240 com 16-bpp


2 bytes por pixel (16 bits por pixel – RGB 565)
Alocação em bytes do frame buffer
= Nºde pixels x ( Bits de profundidade / 8 )
= 320×240 x (16/8)
= 153,600 bytes

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 24


Quiz

P: Um dispositivo anuncia um tamanho


de frame buffer igual a 256Kbytes. Sua
capacidade será suficiente para um
imagem de 480 × 272 com 16-bits de cor?
R: Sim
= Nº de pixels x (Bits de profundidade/ 8 )
= 480×272 x (16/8)
= 261,120 bytes

256Kbytes = 262,144 bytes


261,120 < 262,144
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 25
Operando - “Trocando pixels”

Uma imagem de 8x8 pixel, 16-bpp, fundo amarelo e 4 pixels vermelhos.

Apenas 4 pixels ou 8 bytes para a mudarmos de vermelho para azul.

Essa arquitetura permite que um microcontrolador, sem ser 32 bit, possa


ser usado em um aplicativo incorporando gráficos.

A questão chave é ... como é que estes 4 componentes básicos são


encapsulados e vendidos no mercado?

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 26


Módulo Display

O módulo de Display tem um frame buffer


integrado
O tamanho do frame buffer varia
Módulos menores possuem essa integração, os
maiores não

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 27


Vidro “solto”

Apenas o vidro
Interface RGB
Uso de um chip controlador gráfico externo
(por exemplo o SSD1926)

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 28


Identificando a interface RGB

Procure pelos pinos


VSYNC, HSYNC
Pixel Clock (Dot Clock)
Barramento Red/Green/Blue
Outros esquemas de nomeação
Não confunda com as interfaces
paralelas, padrão Intel 8080 ou
6800 Motorola
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 29
Tipos de ligações - resumo

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 30


Quiz

P: Pode um microcontrolador, sem


módulo controlador de vídeo
integrado, ser utilizado numa
interface RGB tipo vidro “solto”
através de firmware?
R:Não é prático. A interface RGB por
firmware consome grande
quantidade de ciclos de
processamento e memória RAM para
emulação do frame buffer
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 31
Conexão - Tópicos

Interface

Mapeamento de cores

Inicializando o controlador

Interface touch screen


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 32
Mapeamento de cores

RGB 565 RGB 666

Concentremos na interface RGB...


Se o vidro tem entrada no esquema RGB 666, significa
que ele poderá exibir 262.144 cores diferentes.
Se o chip controlador gráfico tem saída RGB 565,
significa que ele pode suportar 65.536 cores.
Como interfacear esses dispositivos?

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 33


RGB 565 para RGB 666
RGB 565 RGB 666 (Display)
Red [4..0] dp_Red [5..1]
dp_Red[5]

ou dp_Red [0]
Vdd ou GND

Green [5..0] dp_Green [5..0]

Blue [4..0] dp_Blue [5..1]


dp_Blue[5]

ou dp_Blue [0]
Vdd ou GND
A melhor opção é conectar o LSB no MSB; isso permite
o display alcançar a excursão máxima de brilho.
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 34
RGB 666 para RGB 565
RGB 666 RGB 565 (Display)
Red [5..1] dp_Red [4..0]

Red [0] Não conectar

Green [5..0] dp_Green [5..0]

Blue [5..1] dp_Blue [4..0]

Blue [0] Não conectar

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 35


Conexão - Tópicos

Interface

Mapeamento de cores

Inicializando o controlador

Interface touch screen


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 36
Inicialização do controlador

TCON

SCK ou
MOSI
Um controlador (TCON) requer uma incialização.
Normalmente, uma porta padrão SPI com apenas os pinos SCK e
DI. As palavras são de 9-bit ou 12-bit.
Pode ser ligado diretamente ao MCU, ou se o chip controlador
gráfico tem pinos GPIO sobressalentes, podemos utilizar estes
pinos economizando pinos no MCU.
Os valores de inicialização são fornecidos pelo fabricante.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 37


Conexão - Tópicos

Interface

Mapeamento de cores

Inicializando o controlador

Interface touch screen


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 38
Touch Screen Resistivo

Pode ser ligado diretamente ao microcontrolador através de 4


pinos.
O fator relevante para a seleção é verificar se os sinais de toque
estão integrados ao Flat Flex Cable (FFC) ou são conduzidos
através de um FFC separado.
Dois flats = Dois conectores = custo maior (buzinada do chefe!).
Alguns FFCs podem ser soldados diretamente na PCI, reduzindo o
custo.

Conector Principal – Flat Flex Cable (FFC)


Display
FFC
com Touch Screen
Conector Sinais Touch
FFC

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 39


Conexões Touch - PIC

PIC® MCU Y+
c/ADC
Digital I/O

Digital I/O
X- X+
Dig-O/AN-I

Dig-O/AN-I

Y-

Tipicamente 4 fios, porém existem conexões de 5 e 6 fios

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 40


Varredura 4-fios

PIC® MCU Y+
c/ADC
1
Digital I/O

Digital I/O
0 X- X+
Dig-O/AN-I

Dig-O/AN-I
Sensor

Y-

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 41


Varredura 4-fios

PIC® MCU Y+
c/ADC

Digital I/O

Digital I/O
1
Sensor X- X+
Dig-O/AN-I

Dig-O/AN-I
0

Y-

Pinos do ADC podem atuar como entrada analógia e saída digital.


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 42
Conexões Touch - AR1000

PIC® MCU
c/SPI, UART Varredura
ou I2C
4 fios

AR1000

Rápida implementação!

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 43


Resumo

Interface

Mapeamento de cores

Inicializando o controlador

Interface touch screen


© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 44
Software – Microchip
Graphics Library

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 45


Driver de baixo nível

TCON

ou SCK
MOSI
Inicialização do controlador (TCON)
Acesso a interface paralela – PMP
Inicialização do controlador gráfico
Funções para atualização de pixels no frame buffer
Funções para desenhar formas básicas: quadrado, círculo, arco,
etc.
Funções para desenhar formas complexas: botão, barra de
medida, etc.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 46


Microchip Graphics Library

Image Grátis
Static Text

Button Fontes
Vantagens chave: estrangeiras
• Trabalha com16 e 32-bit PIC® MCUs
• Projeto modular – compila somente aquilo que
você necessita!
• Suporta múltiplas interfaces de usuário
• Independe ao tamanho ou resolução do display
• Baixo custo das ferramentas de
desenvolvimento
• Utilitário para importação de imagens e fontes
• Benefícios Microchip
Código fonte incluso
Diversos drivers de baixo nível
Baixe em www.microchip.com/graphics
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 47
MGL - Visão geral

Camada de Aplicação Específico da


aplicação
Side Button Key Pad Touch Screen

Graphics Objects Layer

Draw Function 1
Grátis
Message Interface

Draw Function 2 Draw Function N


(i.e. 3D Button) (i.e. Progress Bar) …
Módulos
genéricos

Graphics Primitives Layer

Graphics Primitive Functions


(Non-accelerated Line, Circle, Bar, OutText, etc.)

Device Driver Layer

Display Device Driver Graphical Accelerator Específico do


(i.e. PutPixel, GetPixel) (Optional) dispositivo

Display gráfico

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 48


MGL - Widgets
Picture Chart

Buttons

Scroll Bar
Meter Checkbox

List Box
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 49
MGL - Widgets
Group Box
Slider

Edit Box

Radio Buttons
Buttons
c\ imagens

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 50


Graphics Display Designer

È uma ferramenta de design visual que oferece, através de um plug-in do


MPLAB IDE, uma maneira rápida e fácil para criação de interfaces
gráficas (GUI).

O GDD possibilita desenhar, mover, redimensionar e excluir objetos de


tela, criar várias telas estáticas e atribuir um controlador de LCD gráfico.

O GDD elimina a necessidade dos cálculos das coordenadas X e Y


facilitando o posicionamento dos objetos em tela

Recursos gráficos como fontes personalizadas e imagens bitmap podem


ser importados para o GDD.

Acesse:
http://www.microchip.com/stellent/idcplg?IdcService=SS_GET_PAGE&no
deId=2680&dDocName=en544475

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 51


Bitmap and Font Converter

Utilitário gratuito fornecido com a MGL


Compatibiliza ao formato da biblioteca

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 52


Quiz

P: A MGL pode importar fontes e


imgens. Isso significa que posso
usá-las em meu produto ao
baixá-las da web?

R: Não. Licenças são


necessárias para algumas fontes
e imagens.
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 53
Recursos adicionais

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 54


Graphics Design Center

Barra de
navegação

Webinars
App Notes
Página de FAQ
produto

http://www.microchip.com/graphics
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 55
MGL - Ajuda

Os arquivos de ajuda são parte da


instalação e ficam localizados na
pasta :

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 56


Ferramentas

Microchip Graphics Library


http://www.microchip.com/graphics
MPLAB® IDE
http://www.microchip.com/mplab
MPLAB 16 and 32-bit Compilers
http://www.microchip.com/mplabc
Color Schemer
http://www.colorschemer.com
GIMP – Editor de imagens
http://www.gimp.org

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 57


www.microchipdirect.com
DM320001 or DM320003
PIC32 Starter Kit LCD0025
Truly 3.2” 240x240
Display
Explorer 16BR (TFT2N0369-E)

AC164127-5 AC164127-4
Graphics LCD Graphics Display
Controller PICtail™ Truly 3.2”
IC00409
Plus SSD1926 Board 240x320 Board
(SSD1926)
AC164127-3
Graphics PICtail Plus Daughter Board
© 2009 Microchip Technology Incorporated. All Rights Reserved. with 3.2” Display Kit Slide 58
www.microchipdirect.com

MPLAB® Starter Kit for PIC24F


DM240011

MPLAB Starter Kit for PIC24H


DM240021

Utilizam display OLED monocromático de


128x64
Utilizam a MGL
© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 59
Recursos adicionais

Forum Técnico
http://www.microchip.com/forums
Blog
http://blog.notesfromthelab.com
Regional Training Center
http://www.microchip.com/rtc
www.labtools.com.br

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 60


Resumo

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 61


Resumo

• Aplicações
• Selecionando o display
• Conexão display\microcontrolador
• Software – Microchip Graphics Library
• Recursos adicionais
• Perguntas

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 62


Seleção do display – Fatores de
influência…
Tecnologia (STN, CSTN, TFT, OLED, …)
Consumo
Alimentação
Brilho & Contraste
Interno vs. Externo
Ângulo (campo) de visão
Tamanho & resolução
Flat Flex Cable (FFC) – conector ou soldável
Touch Screen – integrado ao FFC ou separado
Interface RGB ou Paralela (display com Frame Buffer
integrado)
Mecânica

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 63


Seleção do display – Fatores de
influência…
Disponibilidade de amostras
Vendas/suporte local, documentação
Vida útil – consigo trabalhar por quantas horas?
Ciclo de vida do produto – ficará em produção por
quanto tempo?
Lead Time
Preço

Inicie com um dispositivo que atenda suas


especificações , migre mais tarde para as opções de
maior valor agregado.

Para a compra ser eficiente, alie o que você


procura com a disponibilidade do mercado.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 64


Perguntas?

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 65


Demonstração…

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 66


Obrigado!

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 67


Trademarks
The Microchip name and logo, the Microchip logo, dsPIC, KeeLoq, KeeLoq
logo, MPLAB, PIC, PICmicro, PICSTART, rfPIC and UNI/O are registered
trademarks of Microchip Technology Incorporated in the U.S.A. and other
countries.
FilterLab, Hampshire, HI-TECH C, Linear Active Thermistor, MXDEV, MXLAB,
SEEVAL and The Embedded Control Solutions Company are registered
trademarks of Microchip Technology Incorporated in the U.S.A.
Analog-for-the-Digital Age, Application Maestro, CodeGuard, dsPICDEM,
dsPICDEM.net, dsPICworks, dsSPEAK, ECAN, ECONOMONITOR, FanSense,
HI-TIDE, In-Circuit Serial Programming, ICSP, ICEPIC, Mindi, MiWi, MPASM,
MPLAB Certified logo, MPLIB, MPLINK, mTouch, nanoWatt XLP, Omniscient
Code Generation, PICC, PICC-18, PICkit, PICDEM, PICDEM.net, PICtail,
PIC32 logo, REAL ICE, rfLAB, Select Mode, Total Endurance, TSHARC,
WiperLock and ZENA are trademarks of Microchip Technology Incorporated in
the U.S.A. and other countries.
SQTP is a service mark of Microchip Technology Incorporated in the U.S.A.
All other trademarks mentioned herein are property of their respective
companies.
© 2009, Microchip Technology Incorporated, Printed in the U.S.A., All Rights
Reserved.

© 2009 Microchip Technology Incorporated. All Rights Reserved. Slide 68