Librerias Graficas Con PIC32 PDF

Mauricio Jancic
FAE - Artimar Ltda.

mauricioj@artimar.com.br
Csar Angel Fuoco
FAE Electrnica Elemon S.A.
cesarfuoco@elemon.com.ar
2011 Microchip Technology Incorporated. All Rights Reserved. Slide 2
Objetivos del Workshop
l Programar Interfaces grficas hechas con
Imgenes y fuentes ( caracteres ) en un display
grfico.
l Programar Interfaces grficas para mostrar y
controlar objetos ( widgets ) en un display
grfico.
l Disear GUIs ( Interfaz grfica de usuario) en C
utilizando las libreras grficas de Microchip
l Incorporar conocimientos bsicos sobre el
hardware necesario para utilizar displays
grficos.
l Introduccin
l Hardware y Controladores Grficos
l Entorno de trabajo Resumen PIC32
l Terminologa
l Layer de Primitivas
l Lab 1 Pantalla Splash
l Dibujo de Objetos/Widgets
l Lab 2 Creacin de un Menu con Iconos
l Interfaz con el usuario (Message Interface)
l Lab 3 Control de Leds ( Message Callback )
l Diseo de Multiples pantallas
l Lab 5 Aplicacin integradora
Agenda
Microchip Graphics
Library
Introduccin
Antes que nada....
Listas enlazadas
NULL
Pointer
Data
Data
Pointe
r
Pointer
Data
Data
Pointe
r
Pointer
Data
Data
Pointe
r
Pointer
Data
Data
Pointe
r
Pointer
Data
Data
Pointe
r
NULL
Data
Data
COMIENZO
Instrucciones para preparacin para los ejercicios
Dkfkf
Kfkfk
Como funciona
l Compatibilidad con 16 y 32-bit PIC
MCUs
l Diseo y programacin modular => Compilas solo lo que
vas a utlizar!
l Soporta hasta 24 bpp color depth
l Las ltimas versiones de la librera soportan:
Gradients
Transparency
Alpha blending
Transitions
l Las libreras son gratutas para clientes de Microchip
l Codigo fuente incluido
l Variedad de Drivers para los controladores de display
Para desglosar lo que vemos
Hea
t
Botones
Imagenes
Texto Esttico, con Fuente
Estructura general de la
Librera
Graphics Design Center
http://www.microchip.com/graphics
Microchip Application
Libraries
http://www.microchip.com/MLA
Microchip Solutions
v2011_07_14
Microchip Solutions
v2011_07_14
l Demo Projects
l Find individual projects
in these directories
l All paths relative to the
Microchip directory
Microchip Solutions
v2011_07_14
l Microchip board support
l Touch screen
l Memory
l Potentiometer
l Accelerometer
l etc
Microchip Solutions
v2011_07_14
l Source files for all libraries
l Help files for all libraries
Microchip Solutions
v2011_07_14 / Microchip
l Help files for all libraries
Microchip Solutions v2011_07_14
/ Microchip / Help
l Abbreviations for the
Microchip development
boards used in demos
l Graphics Library APIs and
demo user guides
Library Help
..\MicrochipSolutionsv2011_07_14\Help
Help files are included as part of the
Microchip Graphics Library
installation and are located in the
following directory:
Graphics Library Help.chm
Graphics Library Help.p!
Microchip Solutions
l Files needed by all libraries
l Graphics library C files
l Graphics library h files
Microchip Solutions
v2011_07_14/ Microchip/
Graphics
l Utilities for use with the
l Graphics Resource Converter
l External Memory Programmer
Microchip Solutions
Graphics
l Schematics for the Microchip
Graphics development boards
l Users guides for Microchip
Graphics demo projects
Microchip Solutions
Graphics
l Free fonts
l Free images and icons
Microchip Solutions
Graphics
l C source files for graphics
(LCD) controllers
Included Drivers
Microchip Graphics
Library
Hardware y Controladores Grficos
Arquitecturas de Display
ms habituales
l Display Module
l LCD
l Controlador de display
l Frame Buffer
l IC controlador externo
l Frame Buffer
l Display Controller
l 2D Acceleration
l LCD
l MCU con frame-buffer y
controlador incorporado
l LCD
l MCU con controlador
l Frame buffer externo
(SRAM)
Arquitecturas de Display
ms habituales
Grficos de bajo costo
Familia PIC24FJ DA
Maneje directamente Displays de color usando el controlador grfico
incorportado
Aceleracin grfica por hardware
Permite animaciones y scroling
Descompresin de imgenes
Renderizado de caracteres Mostrar texto
256 Entry Color Lookup Table Enables 16-bit Color Depth
Gran variedad de colores con bajo consumo de memoria
Ahorro de costos usando RAM interana de 96 KB RAM para displays
QVGA de 8 bpp
C
o
n
t
r
o
l
a
d
o
r

d
e

d
i
s
p
l
a
y
Descompresin de
imgenes
Procesamiento
de rectngulos
Procesamiento
de caracteres
96 KB RAM
Frame Buffer
Color
Lookup Table
PIC24F Core
Intefaces grficas con el
PIC24/PIC32
Graphics
Controller
16-bit
PMP
hasta resoluci hasta resoluci n n
WVGA (800x480) WVGA (800x480)
Frame
Buffer
Interfaces grficas con
la familia PIC32MX
Usando un MCU PIC32 de alta performance, puede manejarse
directamente hasta 65K (16 bpp) Color WQVGA
Elimina el costoso controlador externo
Un PIC32 de alta perfomance permite hacer muchas otras tareas, ademas
de manejar el display!
Directly Drive the
Display
Resoluci Resoluci n QVGA (320x240) o n QVGA (320x240) o
WVGA (800x480) WVGA (800x480)
Ethernet
CAN
USB
512 KB
Flash
128 KB
RAM
La solucin Controlerless (sin controlador)
Libreras grficas
Objetos grficas pre-hechos
(botones, sliders, etc)
Mltiples fuentes y lenguajes
Compatible con PICs de 16-/32-bit
Graphics Display Designer
Herramienta virtual para diseo
Interfaz grfica (wizard)
Trabaja con la librera grfica
Herramientas para
pantallas grficas
Hea
t
Button
Image
Static Text
Placa de Desarrollo
PIC24FJ256DA210
Soporta QVGA
(8bpp) con la
memoria del PIC
Soporta WQVGA
con la memoria
externa
Part # DM240312
Conectar a alguna de nuestras
placas con displays TFT
Flash y RAM adicional
para guardar mas objetos,
imagenes o fuentes
Slot de expansin
para placa PICtail
Plus
LCC (Low-Cost Controllerless)
Graphics Board
Part # AC164144
Conectable a las placas demo de display
de Microchip
Usable con cualquier PIC32
Starter Kit
" 80 MIPS 32-bit performance
" 128 KB of on-chip SRAM
" High speed 16-bit PMP
" High performance DMA carga
el CPU solo un 5%
SRAM incluida de 256 KB
Soporta hasta WQVGA @ 16 bpp color
El PIC32 solo soporta QVGA @ 8 bpp color
C
o
n
e
c
t
a
b
l
e

a

l
a

p
l
a
c
a

E
x
p
l
o
r
e
r

1
6
Puede usarse o no
Manejando displays sin necesidad de un controlador
Controladora Grfica TFT 7
Elemon ( Diseo Nacional )
PIC32MX795F512L
Controlador grfico SSD1963
USB Power 5V
TFT240432-7-E 4.2"
TFT800480-33-E 7"
2 UARTs CAN
1UART RS485
6 Entradas Digitales
1 Memoria Flash SPI 32Mbits
3 Entradas digitales
2 Pulsadores
3 Leds indicadores
USB Device
ICSP
ADEMAS!
Microchip Graphics
Library
Entorno de trabajo Resumen PIC32
Software
Tools
IDE
C Compiler
Assembler
Code Generators
Entorno de desarrollo de MCU
Elementos Bsicos
Hardware
Tools
Debuggers
Emulators
Programmers
Bench Test Equip
Target
Hardware
Development Kits
Your Hardware
FUNCTION RESET
ACTIVE
STATUS
Ecosistema de MPLAB
X
MPLAB
X IDE
l IDE Universal que soporta +800 dispositivos
Todos los de 8-bit,16-bit, 32-bit PIC
MCUs, dsPIC
DSCs
y las memorias
l Funciona en Windows
, MAC OS, Linux

l Soporta Compiladores Microchip,
simuladores, emuladores, debuggers y starter
kits
l Soporta muchas herramientas de terceras
partes
Compiladores MPLAB
XC
Proximamente en 2012
MPLAB
XC8 MPLAB
XC16 MPLAB
XC32
8-bit Compiler 16-bit Compiler 32-bit Compiler
PIC10, PIC12,
PIC16, PIC18
PIC24,
dsPIC30, dsPIC33
PIC32
Hi-Tech PICC MPLAB C30 / GCC MPLAB C32 / GCC
CCI Common Compiler Interface
Free
Sin costo, para produccion, soporte a travs de foros
Standard
Bajo costo, mayor optimizacin, acceso a soporte prioritario
Professional
Precio completo, optimizacin completa, soporte prioritario
Optimizacin segn
version del compilador
Eval
Todos los
dispositivos
soportados
Optimizacion
PRO por 60 dias,
luego se convierte
a FREE
Uso comercial
permitido
Eval
Todos los
dispositivos
soportados
Optimizacion
PRO por 60 dias,
luego se convierte
a FREE
Uso comercial
permitido
Free
Todos los
dispositivos
soportados
Optimizacion
mnima
Uso comercial
permitido
Free
Todos los
dispositivos
soportados
Optimizacion
mnima
Uso comercial
permitido
Standard
Todos los
dispositivos
soportados
Optimizacion
20%-25% mayor
al FREE
Uso comercial
permitido
Standard
Todos los
dispositivos
soportados
Optimizacion
20%-25% mayor
al FREE
Uso comercial
permitido
PRO
Todos los
dispositivos
soportados
Optimizacion 50%
mayor al FREE
Uso comercial
permitido
PRO
Todos los
dispositivos
soportados
Optimizacion 50%
mayor al FREE
Uso comercial
permitido
GRATIS GRATIS $495 $995
N
i
v
e
l

d
e

o
p
t
i
m
i
z
a
c
i
n
Migracin de compiladores a
MPLAB
XC
16-Bit
16-Bit
32-Bit
32-Bit
8-Bit
8-Bit
www.microchip.com/mplabxc-migration
El Ecosistema MPLAB
X
Comparacin de Debuggers
PICkit3 ICD 3 REAL ICE
USB Speed Full Full / High Full / High
Power to Target

HW Breakpoints

SW Breakpoints
& Stopwatch

Trace
Feature

Data Capture

Logic Probe / Trigger

PICkit3
l USB (Full speed)
l Proteccin por sobre
tensin y corto circuito
incorporada
l Firmware actualizable
l Soporta 2.0V to 6.0V
l Programa hasta 512K
byte de flash con el
modo Programmer-to-Go
l Placa demo con el
PIC18F45K50
DV164131 PICkit3 Debug Express
MPLAB
ICD 3
l USB (Full/High Speed)
incorporada
l Soporta multiples
breakpoints y stopwatch
DV164035 MPLAB
ICD 3
MPLAB
REAL ICE
l USB (Full/High Speed)
incorporada
l Instrumented Trace
l Real Time Watch
l 8 Logic Probe Ins/Outs
DV244005 MPLAB
REAL ICE
Resumen PIC32
Lanzado en el 2007, ahora cuenta con 7 familias
El PIC32 brinda un nuevo nivel de performance
de procesamiento a los MCUs de bajo costo
Stacks de software mas importantes disponibles
en forma de codigo y sin pago de licencias
Facil de migrar entre nuestros +600 MCU,
teniendo asi una plataforma comun a lo largo de
mltiples productos
Microcontrolador PIC32
Caractersticas Generales
32-bit MIPS M4K Core,
Harvard Architecture,
Single Cycle Hardware MAC,
Fast Interrupts & Context Switch
Controlador DMA con mdulo
CRC incorporado. Trabaja en el
modo Idle
Compatible con las
herramientas de desarrollo
Microchip MPLAB
ICD 2,
REAL ICE,
PICkit2, PM3
128-bit wide, 30 MHz
Self-programmable Flash,
Predictive Instruction Pre-fetch
256 Byte Lockable Cache
16-bit Parallel Master Port,
Connect SRAM, Flash, QVGA
LCDs or other Peripherals
Perifericos analgicos y
digitales compatibles con los
PIC de 16-bit
Fuente de alimentacion
simple de 2.3V a 3.6V.
Power On Reset,
Brown Out Reset,
Low Voltage Detection
Controlador USB On-The-
Go (Host, Device, Dual
Role) con canal DMS
dedicado y transceivers
integrados
High Throughput Bus Matrix,
which Supports High Speed
Concurrent Access to Memories
and Peripherals
Portfolio de PIC32MX
PIC32MX7
USB +
2 CAN + ENET
PIC32MX5
USB +
1 CAN
PIC32MX6
USB +
ENET
256/64
256/64
512/64
512/64
256/64
256/64
512/64
512/64
128/32
128/32
64/16
64/16
256/64
256/64
512/64
512/64
4

G
P

D
M
A
64/32
64/32
128/32
128/32
PIC32MX3
GP
128/16
128/16
64/16
64/16
32/8
32/8
512/32
512/32
256/32
256/32
128/32
128/32
PIC32MX4
USB
32/8
32/8
512/32
512/32
256/32
256/32
128/32
128/32
0

G
P

D
M
A
4

G
P

D
M
A
512/128
512/128
128/32*
128/32*
64/32
64/32
* 1 CAN
M
e
m
o
r
i
a
Integracin
8

G
P

D
M
A
PIC32MX1
GP
32/8
32/8
PIC32MX2
USB
4

G
P

D
M
A
32/8
32/8
16/4
16/4
16/4
16/4
28-44 pin
64-100 pin
64-100 pin
Compatibilidad y Performance
Basic control (RX/TX)
9-bit mode
Address detect
16-bit baud rate generator
LIN support
Auto-baud, wake, sync
Polarity
Error checking
PIC18F
Las APIs de la librer Las APIs de la librer a de perif a de perif ricos hacen que la migraci ricos hacen que la migraci n sea muy simple! n sea muy simple!
PIC24F PIC32MX
Example: Using UART across 8-, 16-, and 32-bit families
Parity
Flow control
IRDA
Address matching
DMA
9-bit mode
Address detect
LIN support
Polarity
Error checking
Parity
Flow control
IRDA
9-bit mode
Address detect
LIN support
Polarity
Error checking
Microchip Graphics
Library
Terminologa
Terminologa
l Interfaz de aplicacin ( API : Application Programming
Interface ) Conjunto de funciones que pueden ser llamadas desde
una aplicacin para acceder a funciones de otro programa o
librera.
l Primitivas ( Graphics Primitives ) Bloque grfico elemental:
puntos, lneas, arcos, circulos, triangulos. Son figuras geomtricas
elementales.
l Objetos ( Graphics Object / Widgets ): Elementos y formas
grficas ( botones, charts, diales, sliders, etc) que pueden
renderizarse en la pantalla y pueden ser controladas como fuentes
de entrada en nuestra pantalla.
l Glyph: Representacin grfica de un caracter en un sistema de
escritura dado. (Ej.: Caracteres Chinos )
Modelo de Color RGB
CMYK es un modelo de color substractivo
de Cyan, Magenta, Amarillo y Negro ,
pero no esta soportado por la librera.
Modelo de Color RGB
El modelo de color RGB es un modelo de color aditivo en el que el rojo,
verde y azul se suman de diversas maneras para reproducir una amplia
gama de colores.
Los colores se expresan en funcin de Rojo Verde y Azul Source: Wikipedia
16-bit
(65,536 colors)
Red: 5 bits
Green: 6 bits
Blue: 5 bits
RGB 565
18-bit
(262,144 colors)
Red: 6 bits
Green: 6 bits
Blue: 6 bits
RGB 666
24-bit
(1.678M colors)
Red: 8 bits
Green: 8 bits
Blue: 8 bits
RGB 888
Definicin
Profundidad de Color
La Profundidad de Color ( Color Depth ) es el numero de bits empleado
para representar el color de un solo pixel de una imagen o de un frame.
Se expresa usualmenete en bpp (bits per pixel) . Una profundidad de
color superior ofrece una amplia gama de colores distintos.
l True Color => 24 bpp (16,777,216 colors)
l High Color => 16 bpp (65,536 colors)
l Indexed Color => Use of a color lookup table
l Palette stored as part of image file
l Required for images 8 bpp or less
l LCD System specifications color depth refers to the
capacity of the hardware
l Image Files color depth impacts memory size
Definicin
Profundidad de
Color (Color Depth)
Profundidad de
Color (Color Depth)
Monochrome 1 bpp 4 Shades of Grayscale 2 bpp
256 Colors 8 bpp 65K Colors 16 bpp
Familia PIC24FJ DA - Internal RAM
l 2 internal RAM con capacidad de 24 or 96 Kbyte
l Internal RAM puede destinarse para proposito general o frame buffer
l Frame buffer can be allocated across internal and external memory
boundary when using the 96Kbyte option
Display Resolution
Color Depth/
Memory Requirement in (Bytes)
Vertical Horizontal
Internal Frame Buffer
Internal and/or External Frame
Buffer
1 bpp
(Mono)
2 bpp
(4 shades)
4 bpp
(16 shades)
8 bpp
(256 colors)
16 bpp
(65K colors)
480 272 16,320 32,640 65,280 130,560 261,120
320 240 9,600 19,200* 38,400 76,800 153,600
160 240 4,800 9,600 19,200* 38,400 76,800
160 160 3,200 6,400 12,800 25,600 51,200
128 64 1,024 2,048 4,096 8,192 16,384
- DA106/DA110 family 24K byte RAM
- DA206/DA210 family 96K byte RAM
- DA110 family 24K byte RAM, AND external
SRAM
(*) May need to switch to DA devices with 96KB RAM
www.microchip.com/Microchip.webcontent.provider/Video.aspx?id=en548824
Color Indexado
( Color Lookup Table )
l Tambien llamada Paleta de colores
l La imagen no esta representada por sus
colores sino por una cantidad de numeros que
son indices de una tabla.
l La familia PIC24 DA soporta 256 entradas de 16
bpp para cada color
65,536 colors
256 slots
Color Indexado
Color Indexado
l Para una resolucin de 640x480 una imagen de
24 bpp requerira 900Kbytes ( sin compresin )
l La misma imagen puede representarse con una
combinacin de 256 colores. Asi utilizando
CLUT consumira 300Kbytes
l Una tabla en memoria para 24bpp ocupa tan
solo 256 x 4 Bytes = 1Kbyte . Puede haber mas
de una tabla en memoria ( Paleta 1, Paleta 2)
l Para convertir una imagen RGB plana a una con
color indexado se aplica el algoritmo de Median
Cut
PIC24F DA Color Lookup
Table
Image #1
(256 colors)
Color Lookup Table
(Palette #1)
Screen
Update
Image #2
(256 colors)
Image #N
(256 colors)
Screen
Update
Color Lookup Table
(Palette #2)
Color Lookup Table
(Palette #N)
Microchip Graphics
Library
Configuracin
Primeros pasos..
l Instalar las Libreras de Microchip
l Crear un proyecto en cualquier parte
de tu disco rgido ( Ej: C:\My_Proyecto )
l Copiar en la ruta del proyecto la carpeta:
../MicrochipSolutionsv2011_07_14
l Copiar HardwareProfile.h y GraphicsConfi.h
l In MPLABX
IDE, create a new project

Microchip Solutions
l Files needed by all libraries
l Graphics library C files
l Graphics library h files
Create MPLAB
IDE Project
Header Files
l Agregar los siguientes headers de:
.../Microchip/!nclude/Graphics
l #isplay#river.h
l $!%colors.h
l G&L.h
l Graphics.h
l 'rimitive.h
l Driver.h (driver specific header file)
l Tambien se pueden agregar:
l Widget.h (widget specific header files)
l $!%epmp.h or $!%pmp.h (to support use of Parallel Master Port)
l your(nter!ace.h (to support your custom interface e.g. SPI)
l 'alette.h (only if color lookup table is used)
l TCONDriver.h (Optional timing controller specific header file)
l $!%tcon.h (Only if a timing controller is used)
Create MPLAB
IDE Project
Header Files
l Add the following header files using relative paths from
../Microchip/!nclude
l )ompiler.h
l Generic*ype#e!s.h
l *ime#elay.h
l Add application specific header files
l Main.h
l Graphics)on!i$.h
l Har+are'ro!ile.h
l )ustom)olors.h (if application customizes color names)
l For Microchip Boards, add files from ..,-oarSupport'ac.a$e
l In MPLAB IDE, add ../Microchip/!nclude to the
include search path
Create MPLAB
IDE Project
Header Files
l Add the following source files using relative
paths from ../Microchip/Graphics
l G&L.c
l G&L/ont#e!ault.c
l 'rimitive.c
l Driver.c (driver specific header file)
l If needed, also add:
l Widget.c (widget specific header files)
l G&LScheme#e!ault.c (not needed if application defines its
own default style scheme)
l 'alette.c (if using color look up table)
Create MPLAB
IDE Project
Header Files
l Add the following source files using
relative paths from ../Microchip/Co##on
l *ime#elay.c
l Add application specific files
l Main.c
l If needed, add the image and/or font files
generated by Graphics Resource Converter
l For Microchip Development Boards, add
files from ..,-oarSupport'ac.a$e
Dependencies
Display Driver Layer Dependencies
Primitive Layer Dependencies
GOL Dependencies
Application
l In main application file, add include statements
l Be sure to provide appropriate callback
functions
l Write application code
l Happy Coding!!
#include CustomColorDefines.h
#include Graphics/Graphics.h
#include HardwareProfile.h
Hardware Configuration
HardwareProfile.h
Graphics Display
Draw Function 1
(i.e. 3D Button)
Draw Function 2
(i.e. Progress Bar)
Draw Function N
Application Layer
Message Interface
Device Driver Layer
Graphics Primitive Functions
(Non-accelerated Line, Circle, Bar, OutText, etc.)
Graphics Primitives Layer
Graphics Objects Layer
Generic
Modules
Device
Specific
Application
Specific

Key Pad Touch Screen Side Button
Display Device Driver
(i.e. PutPixel, GetPixel)
Graphical Accelerator
(Optional)
HardwareProfile.h
l Required by Pri#itive.c, $ispla%$river.h, f&ep#p.h or
f&p#p.h, and the display driver files
l Configure display specific macros including:
l Provide driver specific definitions including:
#define DISP_ORIENTATION 90
#define DISP_HOR_RESOLUTION 240
#define DISP_VER_RESOLUTION 320
#define GFX_USE_DISPLAY_CONTROLLER_MCHP_DA210
#define GFX_USE_DISPLAY_PANEL_TFT_G240320LTSW_118W_E
#define USE_16BIT_PMP
HardwareProfile.h
l Provide application specific macros such as:
l Touchscreen macros, pin definitions and calibration values
l Generic display macros
l Board level macros for memory pins
l Example files are included in
../MicrochipSolutionsv2011_7_14/ Graphics / <demo> /Confis
#define USE_TOUCHSCREEN_RESISTIVE
#define LAT_XPOS LATBbits.LATB11
#define LAT_YPOS LATBbits.LATB10
#define DisplayConfig() TRISDbits.TRISD10 = 0
#define DisplayEnable() LATDbits.LATD10 = 0
#define DisplayDisable() LATDbits.LATD10 = 1
Software Configuration
GraphicsConfi.h
Graphics Display
Draw Function 1
(i.e. 3D Button)
Draw Function 2
(i.e. Progress Bar)
Draw Function N
Application Layer
Message Interface
Device Driver Layer
Graphics Primitive Functions
(Non-accelerated Line, Circle, Bar, OutText, etc.)
Graphics Primitives Layer
Generic
Modules
Device
Specific
Application
Specific

Key Pad Touch Screen Side Button
Display Device Driver
(i.e. PutPixel, GetPixel)
Graphical Accelerator
(Optional)
Using Custom Colors
l Library provides predefined colors in
../../Microchip/!ncludes/Graphics/f&colors.h
l For 16- and 24 bpp, applications may use
RGBConvert(R:G:B) macro to set color names
l For 8bpp and lower, colors are represented by an index
used to locate actual color value in the color lookup
table
l To override library defined colors, the application must
include its custom file prior to including Graphics.h
#define BRICKRED RGBConvert(128:0:0)
#include CustomColorDefines.h
#include Graphics/Graphics.h
GraphicsConfi.h
l Required by G'(.h, Graphics.h, $ispla%$river.h, Pri#itive.h, and the
display driver header files
l Enable library options:
l Enable special features
#define USE_TOUCHSCREEN
#define USE_KEYBOARD
//#define USE_FOCUS
#define USE_NONBLOCKING_CONFIG
#define USE_PALETTE
#define USE_TRANSPARENT_COLOR
#define USE_TRANSITION_EFFECTS
#define USE_COMP_RLE
#define USE_ALPHABLEND
#define USE_GRADIENT
l Enable widgets
l Enable special driver features (DA210 only)
l DA210 features are covered in AN1368 or in
MASTERs class 1567 GFX2
GraphicsConfi.h
#define USE_GOL
#define USE_BUTTON
//#define USE_WINDOW
#define USE_METER
//#define USE_SLIDER
//#define USE_PROGRESSBAR
#define USE_DOUBLE_BUFFER
#define USE_COMP_IPU
l Define font structure locations
l Define font character type
l Font tables with more than 256 characters
l USE_MULTIBYTECHAR
l OR font tables with maximum of 256 characters
l USE_UNSIGNED_XCHAR
l If neither defined, default is XCHAR (limit 128 characters)
l Define image structure locations
GraphicsConfi.h
#define USE_FONT_INTERNAL
#define USE_FONT_EXTERNAL
#define USE_BITMAP_INTERNAL
#define USE_BITMAP_EXTERNAL
l Provide application specific definitions
l To define RTOS specific malloc and free functions
l Define the color depth used in the application
l Valid values are 4, 8, 16 or 24
l Customize the name of the default scheme
l Example files provided in:
..,MicrochipSolutionsv2011_07_14,Graphics, <demos>
GraphicsConfi.h
#define GFX_malloc(size) malloc(size)
#define GFX_free(pObj) free(pObj)
#define COLOR_DEPTH 8
#define GFX_SCHEMEDEFAULT GOLSchemeDef
(i)rar% *%pedefs
l Microchip Graphics Library defines several types
(aka storage classes)
l XCHAR
l FONT_FLASH
l FONT_EXTERNAL
l IMAGE_FLASH
l IMAGE_EXTERNAL
l GOL_SCHEME
l GOL_MSG
l OBJ_HEADER
l WIDGET actual name depends on the WIDGET used
Microchip Graphics
Library
Layer de Primitivas
Primitive Layer
l Provides the primitive functions used to build
graphical objects
l Bevel
l Line
l Bar
l Etc
l Includes functions required to render fonts and
images
l Microchip Graphics Library v3.0 added
functions to support gradients and
transparency
l Only functions not implemented in the driver
files are compiled
Primitive Functions
l InitGraph()
l Initializes display system
l Sets cursor position to upper left corner
l Clears active page with BLACK
l Sets drawing color to white
l Disables clipping
l ClearDevice()
l Clears screen with current color
l Puts cursor at (0,0)
l May be implemented in driver layer
Primitive Functions
Drawing Properties
l SetColor(X)
l X = desired color (type GFX_COLOR)
l Source for macro in #isplay#river.h
l SetLineType(X)
l X = one of the following:
l SOLID_LINE
l DOTTED_LINE
l DASHED_LINE
l SetLineThickness(X)
l X = one of the following:
l NORMAL_LINE
l THICK_LINE
l SetFont(&fontimage)
l &fontimage pointer to the font image table
Primitive Layer Example
Set Background Color
l Example:
l Set background color to black
l Set drawing color to white
int main(void)
{
SetColor(BLACK);
ClearDevice();
SetColor(WHITE);
}
Now we have white
objects on a black screen
int main(void)
{
SetColor(BRIGHTRED);
SetLineType(SOLID_LINE);
SetLineThickness(THICK_LINE);
Line(x1, y1, x2, y2);
Bar(left,top,right,bottom);
SetColor(BLACK);
SetLineType(DOTTED_LINE);
Rectangle(left,top,right,bottom);
}
(x1, y1)
(x2, y2)
(left, top)
(right, bottom)
(left, top)
(right, bottom)
Primitive Drawing
Functions
Primitive Drawing
Functions
(x1, y1)
(r)
(x1, y1)
(r)
x1, y1, r1
x2, y2, r1
int main(void)
{
.
SetColor(BRIGHTBLUE);
SetLineType(SOLID_LINE);
SetLineThickness(NORMAL_LINE);
Circle(x1, y1, r);
SetColor(BRIGHTGREEN);
FillCircle(x1, y1, r);
SetLineThickness(THICK_LINE);
Bevel(x1, y1, x2, y2, r1);
.
}
Graphics Resource Converter
Microchip Graphics
Library
Graphics Resource
Converter
l Free java based utility provided with the library
l Convert files to formats the library understands
l Use for fonts, images, and/or binary files
HELLO WORLD!!
HELLO WORLD!!
Graphics Resource
Converter
MENU BAR
CURRENT
PROJECT
CURRENT SETTINGS
CONVERSION
PROGRESS
CURRENT CONVERSION RESOURCE
RESOURCE
TABLE
Graphics Resource
Converter
HOW TO USE THE TOOL HOW TO USE THE TOOL
Graphics Resource
Converter
ADD IMAGES
ADD
PALETTE
ADD
FONT
ADD
INSTALLED
FONT
ADD
BINARY
REMOVE
FROM
PROJECT
Fuentes
Microchip Graphics
Library
Fonts
l Use Graphics Resource Converter to convert fonts
l True Type (*.ttf)
l Raster Fonts (*.fnt)
l Resulting font
l Stored as an array in internal flash (const section)
l or external memory
l Unicode support via multi-byte characters
l AN1182 -- Fonts in the Microchip Graphics Library
Fonts are electronic data files containing a set of glyphs, characters and
symbols. Fonts are created with font editors and are often considered
works of art. Pre-created fonts are available from many sources, but
may be licensed. Often times they are copyrighted. Please read all
licensing agreements before use.
Definition:
How to get fonts
l Purchase fonts
l Thousands of sources available online
l Read license terms!
l Many websites offer free fonts
l Look for open source fonts
(http://www.openfontlibrary.org)
l Download Google Web Fonts
(http://code.google.com/p/googlefontdirectory)
l Create your own fonts using a font editor
l Fony freeware
l FontForge freeware
l Other editors range in price
l Convert from Open Type
l Results vary depending on the converter
Adding Fonts
Select from File menu
Either click toolbar icon OR

Adding Fonts
Navigate to font file
Navigate to font file
Click Open
Click Open
Adding Fonts
Choose point size
Choose point size
Observe font height
Observe font height
Adding Fonts
Check boxes for
Check boxes for
desired typeface
desired typeface
Adding Fonts
Choose Unicode
Choose Unicode
character range
character range
Starting ending
Starting ending
characters change
characters change
Click OK to add font to
Click OK to add font to
the resource table
the resource table
Adding Fonts
Labels reflect:
Labels reflect:

Font name
Font name

Typeface
Typeface

Point size
Point size

Array name
Array name
Add all to calculate
Add all to calculate
amount of memory
amount of memory
required
required
Reducing Font Memory
Narrow the character range
Narrow the character range
Graphics Resource
Converter
Same font
Same font ~3.5 KB
~3.5 KB
lower
lower
Convert only specific strings
Convert only specific strings
Font Filtering
Application will use the string Hello World!
Since we only need 9 characters, how can we save flash memory
space?
Memory is needed
to save glyphs for
95 characters
Filtering saves
memory by
eliminating
unused
characters
Font Filter
Text File
l Editor must support unicode
l Save in 16-bit unicode format
l Each line must have 3 sections:
l <String Label>:<String>//<comments>
l // Indicator required
l Comments are optional
l Refer to the Graphics Resource Converter
help file or to App Note 1182 for details
Project Settings
Select from Select from
Project menu Project menu
Either click toolbar icon OR Either click toolbar icon OR
Project Settings
Choose compiler Choose compiler
Choose ouput format Choose ouput format
Convert
Convert
Click Convert Click Convert
Navigate to Navigate to
destination folder destination folder
Enter filename Enter filename
Using Fonts
Add generated files to Add generated files to
the project the project
If using external memory, use the
External Memory Programmer utility to
program generated .hex file into the
external memory
Using Fonts
// This font is located in internal flash
extern const FONT_FLASH MyNewFont;
// This font is located in external memory
extern FONT_EXTERNAL externalfont;
XCHAR String1 = Microchip;
XCHAR String2 = Graphics Library;
Configuration reminder
l Graphics)on!i$.h MUST contain preprocessor macros
to
l Define font structure locations
l Define font character type
l Font tables with more than 128 characters
l USE_MULTIBYTECHAR
l OR font tables with less than 128 characters
l USE_UNSIGNED_XCHAR
XCHAR String1 = Microchip;
XCHAR String2 = Graphics Library;
Using Fonts
Hello World!
x1,y1
H
o
w
A
r
e
Y
o
u
?
x2,y2
int main(void)
{
extern const FONT_FLASH myFont;
XCHAR myString1[]=Hello World!;
XCHAR myString2[]=How are you?;
.
SetFont((void*)&myFont);
SetColor(BLUE);
MoveTo(x1,y1); //move cursor
OutText(myString1);
SetColor(BRIGHTRED);
SetFontOrientation(ORIENT_VER);
OutTextXY(x2, y2, myString2);
.
}
Imagenes
Microchip Graphics
Library
Image Support
Definition:
l Microchip Graphics Library supports both
bitmap and jpeg formats
l Color depth up to 24 bpp
l Images are converted using Graphics
Resource Converter utility
l May be compressed using run length encoding
(RLE)
l OR Fixed Huffman if PIC24xxxDAxxxs Inflate
Processing Unit (IPU) is used
Image Support
1 bpp
~2,400 Bytes
4 bpp
~9,600 Bytes
8 bpp
~19,200 Bytes
16 bpp
~38,400 Bytes
Definition:
l Quality vs Memory tradeoff
l Example for a 160 x 120 pixel non-compressed
picture
Resolution and Image
Buffer Size
X
Resolution
Y
Resolution
Pixels Color
Depth
(bpp)
Colors Bytes
Required
Monochrome
1/16 VGA 160 120 19,200 1 2 2,400
1/8 VGA 240 160 38,400 1 2 4,800
QVGA 320 240 76,800 1 2 9,600
Color STN
1/16 VGA 160 120 19,200 8 256 19,200
1/8 VGA 240 160 38,400 8 256 38,400
QVGA 320 240 76,800 8 256 76,800
Color TFT
1/16 VGA 160 120 19,200 16 65,536 38,400
1/8 VGA 240 160 38,400 16 65,536 76,800
QVGA 320 240 76,800 16 65,536 153,600
1/16 VGA 160 120 19,200 18 262,144 43,200
1/8 VGA 240 160 38,400 18 262,144 86,400
QVGA 320 240 76,800 18 262,144 172,800
Adding Images

Adding Images
Adding Images
Label = image file name
Label = image file name
Add to calculate
Add to calculate
amount of memory
amount of memory
required
required
Adding Images
Image size and color depth
Image size and color depth
Reduce Memory
Run Length Enocoding (RLE)
Software decompression
May require more memory
Reduce Memory
Reduce Memory
Inflate Processing Unit (IPU)
Hardware decompression
Uses Fixed Huffman encoding
Supported only in PIC24FJDA family
Reduce Memory
Compressed memory size
Compressed memory size
Project Settings
Project Settings
Choose compiler Choose compiler
Choose output format Choose output format
Choose output Choose output
color depth color depth
Convert
Convert
Click Convert Click Convert
Navigate to Navigate to
destination folder destination folder
Enter filename Enter filename
Using Images
Add generated files to Add generated files to
the project the project
If using external memory, use the
External Memory Programmer utility to
program generated .hex file into the
external memory
Using Images
// This image is located in internal flash
extern const BITMAP_FLASH mchpLogo;
// This image is located in external memory
extern BITMAP_EXTERNAL Sun_4bpp_32x32;
Configuration Reminder
l Graphics)on!i$.h MUST contain preprocessor macros
to
l Define image locations
l Enable compression (if used)
#define USE_BITMAP_INTERNAL
#define USE_BITMAP_EXTERNAL
#define USE_COMP_RLE
#define USE_COMP_IPU
Using Images
stretch options are:
IMAGE_NORMAL
IMAGE_X2
int main(void)
{
extern const BITMAP_FLASH image1;
char stretch = IMAGE_NORMAL;
.
X = GetMaxX()-GetImageWidth((void*)&image1);
Y = GetMaxY()-GetImageHeight((void*)&image1);
//put bitmap in the center
PutImage((X >>1),(Y >> 1), &image1, stretch);
.
}
TIP!
l Keep x,y coordinates relative using:
l GetMaxX(), GetMaxY()
l Return max X or max Y values
l Used to calculate offsets based on the
display resolution set in HardwareProfile.h
l GetTextWidth(string, &font)
GetTextHeight(string, &font)
l Return size of string
l string = Desired string
l &font = Pointer to font image
l GetImageWidth(&bitmap)
GetImageHeight(&bitmap)
l &bitmap = Pointer to bitmap image
Pantalla Splash
Lab Exercise 1
Lab 1
Create a Splash Screen
l In this exercise, you will demonstrate your
ability to use the Microchip Graphics
Library primitive layer functions to create
a splash screen for our end application
l If time allows, you will explore the use of
gradients and transparency to enhance
the splash screen appearance
Purpose
Lab Exercise 1
Objective
l Use the Graphics Resource Converter to generate font and
image files for use in the application code
l Use primitive layer functions to render image and text
strings to the display
l Explore how gradients and transparency can enhance the
splash screen appearance
Requirements: Explorer 16 demo board with PIC24FJ128GA010
Lab 1
l Follow the instructions in the lab
manual starting on page 1-1
Procedure
Objectos Grficos / Widgets
Microchip Graphics
Library
What is a heap?
l Proper memory management required
l Memory Leak:
l Program does not free memory no longer needed
l Leads to heap overrun
l Fragmentation:
l May occur when memory is deallocated in chunks
l New malloc() requests may no longer fit
l Clean up with a defrag engine (not provided in library)
l Both result in runtime errors
l GOLFree() Graphics Library Function
l Removes entire linked list from heap
The heap is an unused pool of memory (similar to a stack) where a
programmer may dynamically allocate memory using malloc() calls. In
the embedded world, it is typically used to store recursive data structures
(e.g. linked lists). Allocated memory must be freed by the application to
avoid difficult runtime errors.
Definition:
Library Widgets
Picture
Buttons
Chart
Meter
Dial
Checkbox
Listbox
Scrollbar (using
Buttons and Slider)
Library Widgets
Slider
Button with
Image
Radio Buttons
Group Box
Edit Box
Static Text
Library Widgets
l New Text Entry Widget
l Custom Widget creation described in AN1246
Microchip Graphics
Library Help -> Release
Notes
Como crear Widgets
Microchip Graphics
Library
Microchip Graphics
Library
Graphics Display
Designer
l Enable widgets in Graphics)on!i$.h
l Failure to enable will result in build errors
Enabling Widgets
#define USE_GOL
#define USE_BUTTON
#define USE_BUTTON_MULTI_LINE
#define USE_CHECKBOX
#define USE_RADIOBUTTON
#define USE_EDITBOX
//#define USE_CUSTOM
//#define USE_WINDOW
#define USE_METER
//#define USE_SLIDER
//#define USE_PROGRESSBAR
Creating Widgets
l Each widget has its own create function
l Used to populate the widget structure
l Obj = Widget abbreviation
l Defined in library help file
l Reference table provided in lab manual
l Example: BtnCreate(,,,) creates a button
l May create multiple widget instances
l Each must have a unique identifier
The ObjCreate(,,) function is used by the library to create widgets
with specified parameters. This function automatically populates the
widgets structure, places the widget into a global linked list and returns a
pointer to the widget structure created.
Definition:
ID_OBJN
ID_OBJ1
ID_OBJ2
ID_OBJ3
Creating Widgets
l ObjCreate(,,,)
l Populates the widget
structure
l Adds widget to bottom of
the active linked list
l Returns a pointer to the
widget structure
l Heap required
l More details on using the
linked list later
Widget Abbreviations
Widget Name Obj Abbreviation
Analog Clock Ac
Button Btn
Chart Ch
Checkbox Cb
Round Dial Rdia
Digital Meter Dm
Edit Box Eb
Grid Grid
Group Box Gb
List Box Lb
Meter Mtr
Picture Control Pict
Progress Bar Pb
Radio Button Rb
Slider/Scroll Bar Sld
Static Text St
Text Entry Te
Window Wnd
Widget Structures
typedef struct {
OBJ_HEADER hdr;
SHORT radius; // Radius for rounded buttons.
SHORT textWidth; // Computed text width, done at creation.
SHORT textHeight; // Computed text height, done at creation.
XCHAR *pText; // Pointer to the text used.
void *pBitmap; // Pointer to bitmap used.
} BUTTON;
typedef struct {
OBJ_HEADER hdr;
WORD pos; // Current progress position.
WORD prevPos; // Previous progress position.
WORD range; // Sets the range of the object.
} PROGRESSBAR;
Button:
Progress Bar:
Creating Widgets
Object Header Members
l ID
l Unique integer used to form a Handle
l Location
l Top, left, bottom, right define
placement
l State
l 16-bit value that defined the widget
state
l Style Scheme pointer
l Defines widget appearance
In Application Code
Example:
void CreateButtons(void)
{
#define ID_BTN2 16
BUTTON *pBtn
pBtn = BtnCreate(
ID_BTN2, // 2nd Button ID
x3, y3, // left, top
x4, y4, // right, bottom
Radius, // Rounded edges
BTN_DRAW, // Display button
(void *)&arrow, // use this bitmap
NULL, // no text
altScheme); // style scheme pointer
}
Widget Help
To find the ObjCreate APIs,
expand the desired widget and
select the appropriate create
function.
Estilos ( Style Schemes )
Microchip Graphics
Library
Widget Style Schemes
l Default scheme provided in G'(CreateSche#e.c
l May be overridden by the application
l Widgets without assigned schemes use the default scheme
l GOLCreateScheme()dynamically creates style schemes
l Populates a new scheme structure
l Returns a pointer to that structure
l Style Schemes may be created at compile time
l Use & operator to reference scheme
l All widgets use style scheme member values differently
l Help file provides pictures
Definition
The Style Scheme is a structure used by the library to define the
appearance of a widget by assigning style properties.
Definition:
Type Member Description
GFX_COLOR EmbossDkColor
3D dark color
GFX_COLOR EmbossLtColor
3D light color
GFX_COLOR TextColor0
Objects with text
GFX_COLOR TextColor1
Objects with text
GFX_COLOR Color0
Assigned to a state
GFX_COLOR Color1
Assigned to a state
GFX_COLOR ColorDisabled
Object in disabled state
GFX_COLOR TextColorDisabled
Object in disabled state
GFX_COLOR CommonBkColor
Used to hide objects
void *pFont
Pointer to font selected
BYTE AlphaValue Define USE_ALPHABLEND
GFX_GRADIENT_SCHEME gradientScheme Define USE_GRADIENT
Style Scheme Structure
Defined in G'(.h
Button Properties
Button
Button
Button
int main(void)
{
GOL_SCHEME *altScheme;
altScheme = GOLCreateScheme();
altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossLtColor = BLUE;
altScheme -> TextColor0 = WHITE;
altScheme -> TextColor1 = YELLOW;
altScheme -> TextColorDisabled = GREY;
altScheme -> Color0 = BRIGHTBLUE;
altScheme -> Color1 = LTBLUE;
altScheme -> ColorDisabled = LTGREY;
altScheme -> CommonBkColor = TAN;
altScheme -> pFont = GOLFontDefault;
}
Button Properties
Button
Button
int main(void)
{

}
Button
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Button Properties
Button
Button
Button
int main(void)
{

}
Estados de los Widgets
Microchip Graphics
Library
Widget States
l 16-bit value used to represent the widgets state
l Member of widget structure
l Drawing states indicate widget needs to be:
l Fully drawn
l Partially drawn
l Hidden
l Property states define action and appearance
l Discussed in detail later
l Macros used to identify state values
l Example: BTN_DRAW indicates button should be fully drawn
l Logical OR used to combine states
l Example: BTN_DRAW | BTN_PRESSED indicates button should be
drawn in the pressed state
Widget Drawing States
l All widget drawing states include:
l OBJ_HIDE
l Indicates widget will be covered with
CommonBkGnd color
l OBJ_DRAW
l Indicates widget will be fully drawn
l OBJ_DRAW_FOCUS
l Indicates widgets focus box will be
drawn
Button Drawing States
Statebit Macro Description
BTN_DISBABLED
Button will not accept messages
BTN_DRAW
Button must be fully redrawn
BTN_DRAW_FOCUS
Button focus must be redrawn
BTN_FOCUS
Button is focused
BTN_HIDE
Button must be covered with CommonBkColor
BTN_PRESSED
Button is in the pressed state
BTN_TEXTBOTTOM
Button text is bottom aligned
BTN_TEXTTOP
Button text is top aligned
BTN_TEXTLEFT
Button text is left aligned
BTN_TEXTRIGHT
Button text is right aligned
BTN_TOGGLE
Button will have a toggle behavior
BTN_TWOTONE
Button will be flat, with two colors
BTN_NOPANEL
Button will be created, but not drawn (icons)
State Macros
l SetState(pObj, state)
l Set specified state
l States remain set until cleared
l ClrState(pObj, state)
l Clear specified state
l GetState(pObj, state)
l Get a widgets state
l Where
l pObj = pointer to the widget structure
l state = desired state
Widget State Help
Every widget also has unique
state bits. These can be found in
the library help file as shown
Renderizado de Widgets
Microchip Graphics
Library
Drawing Widgets
l GOLDraw()
l No input parameters
l Parses linked list
l Checks widget state
l If a drawing bit is set,
widget will be rendered
l Clears drawing bits
l Returns TRUE when done
ID_OBJ1 ->
state bits
ID_OBJ2 ->
state bits
ID_OBJ3 ->
state bits
ID_OBJN ->
state bits
Linked List
Drawing Example
Typical Application Flow
Initialize Graphics &
Create Default Style Scheme
GOLInit()
Create Alternate Style Schemes*
alt = GolCreateScheme()
Create Objects
ObjCreate(,,)
Draw Objects
GOLDraw()
main()
* May skip this step if only using default style scheme
GOLInit() calls
InitGraph() and
GOLCreateScheme()
Rendering Widgets
Example
l Draw 3 widgets on black background
l Flat rounded Enter button
l Flat circle button with white arrow
l Static Text
Static Text
Left Aligned
No Frame
Enter
Drawing Example
Function to Create Buttons
{
#define ID_BTN1 15
#define ID_BTN2 16
altScheme -> EmbossDkColor = BLUE;
altScheme -> TextColor1 = RED;
altScheme -> Color0 = BLUE;
altScheme -> Color1 = LT_BLUE;
altScheme -> CommonBkColor = BLACK;
continued on next slide

Text
Drawing Example
Function to Create Buttons
Enter
BtnCreate( ID_BTN1, // 1st Button ID
10, // Radius = 10
NULL, // no bitmap used
Enter, // use this text
altScheme); // style scheme
BtnCreate( ID_BTN2, // 2nd Button ID
40, // Radius = 40
(void*)&arrow, // use arrow
NULL, // no text
continued on next slide
Static Text
Left Aligned
No Frame
Drawing Example
Function to Create Static Text
void CreateStatic(void)
{
#define ST_TXT1 17
String1 =Static Text \nLeft Aligned

\nNo Frame;
StScheme = GOLCreateScheme();
StScheme -> CommonBkColor = BLACK;
StScheme -> TextColor0 = WHITE;
StCreate( ST_TXT1, // Static Text Box

ST_DRAW, // Display
String1, // Text String
StScheme); // style scheme
} continued on next slide
Drawing Example
Application Code
int main(void)
{ //Initialize Display and
//Set Default Style Scheme
GOLInit();
//Create Widgets
CreateButtons();
CreateStatic();
//Set screen background black
SetColor(BLACK);
ClearDisplay();
//Application Main Loop
while(1){
GOLDraw();
}
}
Enter
Static Text
Left Aligned
No Frame
Creacin de un Men con Iconos
Lab Exercise 2
Lab 2
Create a Menu Screen
l In this exercise, you will demonstrate
your ability to use the Microchip
Graphics Library Graphics Object
layer functions to create a menu
screen for our end application
l If time allows, you will enhance the
icons through the use of
transparency
Purpose
Lab 2
Objective
l Use the ObjCreate(,,,) function to:
l Create 3 Rounded Buttons (one with text, two with
image(no text))
l Create 3 Static Texts to label the Buttons
l Use GOLCreateScheme() to form an alternate
style scheme
l Use GOLDraw() to render the widgets to the
screen
Lab 2
Allocating Heap
Open Project Properties
Insert Screen Shot Here
Right click on project name,
then select properties
OR
Click properties icon in
environment window
Lab 2
Allocating Heap
Select Linker
Select the linker for the
chosen compiler
picxx-ld
Lab 2
Allocating Heap
Enter 3000 in the heap field
Enter Heap Size
Lab 2
Procedure
The touch screen and key pad
are DISABLED for this lab. We
will examine their use in the next
section and labs.
Lab Exercise 2
Button with
Text
Static Text
(Frame State Set)
Static Texts
Button with
Image
Results
Interfaz de Mensajes ( Messaging Interface )
Microchip Graphics
Library
Message Interface
l Simplifies integration of user input
devices
l Allow application to efficiently manage
widgets
l Provides seamless interface for the user
Message Interface
Draw Function 1 Draw Function 1
(i.e. 3D Button) (i.e. 3D Button)
Draw Function 2 Draw Function 2
(i.e. Progress Bar) (i.e. Progress Bar)
Draw Function N Draw Function N
Application Layer

Key Pad Touch Screen Side Buttons
Interfacing the User
Application Requirements Part
1
l Detect user input
l Touchscreen driver files included in library
l Sidebutton and keyboard detection up to user
l Populate message structure (GOL_MSG type)
l Based on the input detected
l Call GOLMsg(&msg)
l Where &msg is address of message structure
l GOLMsg(&msg) translates the message
l Translation determines action (e.g. button looks pressed
or not)
l Application may customize widget response
l Message Structure
l type: identify input device type
l uiEvent: identify the event
l param1:
l param2: provide information based on type and uiEvent
Message Structure
typedef struct {
BYTE type;
BYTE uiEvent;
SHORT param1;
SHORT param2;
} GOL_MSG;
Message Structure
type =
TYPE_TOUCHSCREEN
l Valid uiEvent values
l EVENT_PRESS
l EVENT_STILLPRESS
l EVENT_RELEASE
l EVENT_MOVE
l EVENT_INVALID
l No touch
l param1 = x coordinate of touch
l param2 = y coordinate of touch
Message Structure
type = TYPE_KEYBOARD
l param1 = Object identifier of receiving
widget
l Valid uiEvent values
l EVENT_KEYSCAN
l param2 = Scan Code
l EVENT_CHARCODE
l param2 = character to add
l EVENT_INVALID
l No key pressed
AT keyboard scan
codes are provided in
the library help file in
section 8.4.7
Example
Populate Side Button Message
if(S5){//button is pressed
msg->type = TYPE_KEYBOARD;
msg->uiEvent = EVENT_KEYSCAN;
msg->param1 = ID;
msg->param2 = SCAN_CR_PRESSED;
}else{//button is released
msg->type = TYPE_KEYBOARD;
msg->uiEvent = EVENT_KEYSCAN;
msg->param1 = ID;
msg->param2 = SCAN_CR_RELEASED;
}return;
Widget Message
Translation
Punteros a Widgets
Microchip Graphics
Library
Pointer to Widget
Assign pointer when widget is created
{
BUTTON *pBtn
#define ID_BTN2 16
pBtn = BtnCreate(
ID_BTN2, // 2nd Button ID
Radius, // Rounded edges
&arrow, // use this bitmap
NULL, // no text
}
Declare the Pointer
Assign
Widget
Pointer to Widget
Another Way
l GOLFindObject(ID)
l Returns ADDRESS of the widget
l Avoid mismatch warning by typecasting
BUTTON *pBtn
pBtn = (BUTTON*)GOLFindObject(ID_BTN1);
SetState (pBtn, BTN_DRAW);
pBtn = (BUTTON*)GOLFindObject(ID_BTN2);
SetState (pBtn, BTN_DRAW);
Declare the Pointer
Assign Widget
#define ID_BTN1
BUTTON *pBtn;
currObjID = GetObjID(pBtn);
switch(currObjID){
case ID_BTN1:
//do something useful
break;
}
Widget Identifier
l GetObjID(*pObj)
l Returns ID member of the widget structure
Declare the Pointer
Assign Widget
Propiedades de los Widgets
Microchip Graphics
Library
Recall Widget States
l 16-bit value used to represent the widgets state
l Member of widget structure
l Drawing states indicate widget needs to be:
l Fully drawn
l Partially drawn
l Hidden
l Property states define action and appearance
l Macros used to identify state values
l Example: BTN_DRAW indicates button should be fully drawn
l Logical OR used to combine states
l Example: BTN_DRAW | BTN_PRESSED indicates button should be
drawn in the pressed state
Button Property States
Statebit Macro Description
BTN_DISBABLED
Button will not accept messages
BTN_DRAW
Button must be fully redrawn
BTN_DRAW_FOCUS
Button focus must be redrawn
BTN_FOCUS
Button is focused
BTN_HIDE
Button must be covered with CommonBkColor
BTN_PRESSED
Button is in the pressed state
BTN_TEXTBOTTOM
Button text is bottom aligned
BTN_TEXTTOP
Button text is top aligned
BTN_TEXTLEFT
Button text is left aligned
BTN_TEXTRIGHT
Button text is right aligned
BTN_TOGGLE
Button will have a toggle behavior
BTN_TWOTONE
Button will be flat, with two colors
BTN_NOPANEL
Button will be created, but not drawn (icons)
State Macros
l SetState(pObj, state)
l Set specified state
l States remain set until cleared
l ClrState(pObj, state)
l Clear specified state
l GetState(pObj, state)
l Get a widgets state
l Where
l pObj = pointer to the widget structure
l state = desired state
State Bits Example
Button Widget
Text
Text
Text
Text
if (GOL_DRAW())
{
// Example Button text alignments
ClrState(pBtn, BTN_PRESSED);
SetState(pBtn, BTN_TEXTRIGHT);
// Example Button Focus
SetState(pBtn, BTN_FOCUSED);
// Example Button Action
SetState(pBtn, BTN_DISABLED);
state = BTN_PRESSED|BTN_TEXTTOP|BTN_TEXTLEFT;
SetState(pBtn, state);
// Example Hiding Button
SetState(pBtn, BTN_HIDE)
}
Button States
Text
Text
Text
Text
if (GOL_DRAW())
{
}
Button States
Text
Text
Text
Text
if (GOL_DRAW())
{
}
Button States
Text
Text
Text
Text
if (GOL_DRAW())
{
}
Button States
Text
Text
Text
Text
if (GOL_DRAW())
{
}
Button States
Text
Text
Text
Text
if (GOL_DRAW())
{
}
Two Tone Button
EmbossLtColor
EmbossDkColor
TWO TONE BUTTON
Color0
TextColor0
EmbossDkColor
EmbossLtColor
TWO TONE BUTTON
Color1
TextColor1
Property State Help
State bit descriptions for all
widgets are located in the
Graphics Library Help file under
Widget -> Widget States.
Manejo de Widjets ( Widgets API )
Microchip Graphics
Library
Widget Abbreviations
Widget Name Obj Abbreviation
Analog Clock Ac
Button Btn
Chart Ch
Checkbox Cb
Round Dial Rdia
Digital Meter Dm
Edit Box Eb
Grid Grid
Group Box Gb
List Box Lb
Meter Mtr
Picture Control Pict
Progress Bar Pb
Radio Button Rb
Slider/Scroll Bar Sld
Static Text St
Text Entry Te
Window Wnd
Widget Management APIs
l Widgets with text strings
l ObjSetText(*pObj, *pText)
l ObjGetText(*pObj)
l Returns a pointer to the text string in use
l Works with button, checkbox, edit box, group box, radio
button, static text, and window widgets
l Widgets with images:
l ObjSetBitmap(*pObj, *pImage)
l ObjGetBitmap(*pObj)
l Returns a pointer to the bitmap in use
l Works with picture and button widgets
Widget Management APIs
l Positional Widgets
l ObjSetPos(*pObj, posValue)
l ObjGetPos(*pObj)
l Returns the current position
l ObjSetRange(*pObj, rangeValue)
l ObjGetRange(*pObj)
l Returns the current range
l Works with progress bar and slider widgets
l Widget have various management APIs
available
l Refer to library help file for more details
Widget Management API
Help
The widget management APIs
are found under the individual
widgets in the Graphics Object
Layer section of the help file.
Recepcin de Mensajes
Microchip Graphics
Library
Receiving Messages
l GOLMsg(&msg)
l User must supply pointer to
a message structure
l Immediately returns if
EVENT_INVALID
l Translates message
l Finds affected widget in
linked list
l Modifies widget state
l Returns TRUE when done
ID_OBJ1 ->
state bits
ID_OBJ2 ->
state bits
ID_OBJ3 ->
state bits
ID_OBJN ->
state bits
Linked List
GOLInit()
Create Objects
ObjCreate(,,)
Draw Objects
if (GOLDraw())
main()
* May skip this step if only using default scheme
Perform action
GOLMsg(&msg)
Detect Input**
Populate &msg
** Not library functions
Widget Default Actions
Button
Translated
Message
Button
Pressed?
Button
Released?
SetState(pB,
BTN_PRESSED | BTN_DRAW)
ClrState(pB, BTN_PRESSED)
SetState(pB, BTN_DRAW)
Button
Button
TWO TONE BUTTON
TWO TONE BUTTON
Widget Default Actions
Programar la funcin GOLMsgCallback()
Microchip Graphics
Library
Application Requirements
Part 2
l Provide callback functions (REQUIRED)
l GOLMsgCallback(,,,)
l Called by GOLMsg() only if valid message received
l Customize response to message event
l Example: Change button image on EVENT_PRESS
l Example: Increase volume on EVENT_STILLPRESSED
l Example: Change screen state on EVENT_PRESS
l GOLDrawCallback()
l Called by GOLDraw()when drawing is complete
l Not dependent on message events
l Customized drawing
l ONLY safe place to modify drawing properties
l Example: Modify bars to form a signal strength meter
l Customized system response
l Example: Read a sensor and change a string
l Example: Update a progress bar
What is a Callback?
Definition
A callback function allows a lower level software layer to call a
subroutine defined in a higher layer.
Definition:
MAIN
PROGRAM
LIBRARY
FUNCTION
CALLBACK
FUNCTION
Application Layer
Graphics Object Layer
GOLMsgCallback(,,,)
MAIN
PROGRAM
GOLMsg()
GOLMsgCallback(,,,)
Application Layer
l Called by GOLMsg(&msg)
l Only called if valid message is received
GOLMsgCallback(,,,)
l Called by GOLMsg(&msg)
l MUST be provided in application code
l Perform custom actions:
l Example: Change bitmap when button pressed
l Example: Turn on LED when button pressed
l Input parameters:
l objMsg: Translated message for the widget
l pObj: Pointer to the widget
l pMsg: Pointer to message structure
l Output:
l TRUE: To perform default actions too
l 0 : To skip default actions
GOLMsg() Flowchart
GOLInit()
Create Objects
ObjCreate(,,)
Draw Objects
if(GOLDraw())
main()
Perform action
GOLMsg(&msg)
Detect Input**
Populate &msg
** Application implemented functions
GOLMsgCallback(,,,)**
GOLMsgCallback(,,,)
Example
THUMB
SLDR1
BTN2
BTN1
DOWN UP
GOLMsgCallback(,,,)
Example
UP
l Widget Actions:
l Move slider thumb to the left
l Add down arrow bitmap
l System Action:
l Decrease motor speed
GOLMsgCallback(,,,)
Example
DOWN
l Widget Actions:
l Move slider thumb to the right
l Add up arrow bitmap
l System Action:
l Increase motor speed
GetObjID()
BTN1 and
PRESSED?
SLD1 and
MOVED?
BTN2 and
PRESSED?
Change BTN1
Decrement slider
Set SLD_DRAW_THUMB bit
Call SlowMotor()
Change BTN2 bitmap
Increment slider
Set SLD_DRAW_THUMB bit
Call FastMotor()
INC or
DEC?
RETURN 1
RETURN 1
Yes
Yes
Yes
DEC
INC
no
no
no
Change BTN1
Set BTN_DRAW bit
Call SlowMotor()
Change BTN2
Set BTN_DRAW bit
Call FastMotor()
GOLMsgCallback(,,,)
Example Flowchart
#define ID_BTN1
BUTTON *pBtn;
currObjID = GetObjID(pBtn);
switch(currObjID){
case ID_BTN1:
//do something useful
break;
}
Widget Identifier
Reminder
l GetObjID(*pObj)
l Returns ID member of the widget structure
WORD GOLMsgCallback(objMsg,pObj,pMsg){
objID = GetObjID(pObj);
if(objID == BTN1){
pSldObj = (*SLIDER)GOLFindObject(SLD1);
if (objMsg == BTN_MSG_PRESSED){
BtnSetBitmap(pObj, &redDOWNarrow);
BtnSetText(pObj, NULL);
SldDecPos(pSldObj);
SetState(pSldObj, SLD_DRAW_THUMB);
SlowMotor();}
else{
BtnSetBitmap(pObj, NULL);
BtnSetText(pObj, DOWN);}}
}
GOLMsgCallback(,,,)
Example: Code Snippet
GOLMsgCallback(,,,)
if(objID == BTN1){
SldDecPos(pSldObj);
SlowMotor();}
else{
}
if(objID == BTN1){
SldDecPos(pSldObj);
SlowMotor();}
else{
}
DOWN
GOLMsgCallback(,,,)
Control de LEDs
Lab Exercise 3
Lab 3
l In this exercise you will demonstrate
your ability to use the Graphics
Library Messaging Interface to
respond to a users input
l Additionally, you will demonstrate
your ability to control widgets using
widget states and management APIs
Purpose
Lab 3
l Explore how to use a checkbox to
light and LED on the board
l Use status texts to inform the
user of the current system status
l If time allows, you will replace the
check boxes with radio buttons
and explore the difference
Objective
Lab 3
Procedure
Lab 3
Check Box Static Text
Check Box
Static Text
Results
Microchip Graphics
Library
Customizing the Response
GOLDrawCallback()
Application Requirements
Part 2
l Provide callback functions (REQUIRED)
l GOLMsgCallback(,,,)
l Called by GOLMsg() only if a valid event occurs
l Customize response to message event
l Example: Change button image on EVENT_PRESS
l Example: Increase volume on EVENT_STILLPRESSED
l Example: Change screen state on EVENT_PRESS
l GOLDrawCallback()
l Called by GOLDraw()at end of drawing sequence
l Not dependent on message events
l Customized drawing
l ONLY safe place to modify drawing properties
l Example: Modify bars to form a signal strength meter
l Customized system response
l Example: Read a sensor and change a string
l Example: Update a progress bar
Callback Reminder
MAIN
PROGRAM
GOLDraw()
GOLDrawCallback()
Application Layer
l Called by GOLDraw()
l Used to add system or widget response to user inputs
Customized Drawing
GOLDrawCallback()
l Called by GOLDraw()
l Drawing sequence is completed
l MUST be included in application code
l Return TRUE to return control to GOLDraw()
l Return 0 to keep drawing control
l Perform customized drawing
l Example: Signal strength indicator
l Monitor and control for continuous events
l Example: Read from a sensor and update screen
l Example: Display a countdown timer
l Safest place to modify the linked list
Flowchart for GOLDraw()
GOLInit()
Create Objects
ObjCreate(,,)
Draw Objects
GOLDraw()
main()
Detect Input**
Populate &msg
Perform action
GOLMsg(&msg)
** Not library provided functions
GOLMsgCallback(,,,)**
GOLDrawCallback()**
GOLDrawCallback()
Example: Battery Life Meter
Battery 100%
Battery 80%
Battery 50%
Battery Critical
l Read from power monitor circuit and update display accordingly
100%?
SetColor(GREEN)
Calculate x,y
Call Bar(x,y)
Call StSetText
RETURN
Read Pwr Monitor
GOLDrawCallback()
Example Flow Chart
Timer
Done?
80%? 50%?
<
10%?
SetColor(YELLOW)
Calculate x,y
Call Bar(x,y)
Call StSetText
SetColor(RED)
Calculate x,y
Call Bar(x,y)
Call StSetText
NO
YES
Tips
GOLDrawCallback()
l To erase a bar
l Set the drawing color to the background color
l Call Bar() function with area for one or more bars
l Remember, Bar() returns true when drawing is complete
l To add a bar
l Set the drawing color to desired color
l Call Bar() with bar coordinates
l No pointers are passed into GOLDrawCallback()
l Use GOLFindObject() to get the address of widget
l Application must drawing bits for widgets that need to be
redrawn
l When updating widgets, make sure value changed before setting
draw bit
2011 Microchip Technology Incorporated. All Rights Reserved. 1566 GFX1 Slide 258
Microchip
Graphics Library
Putting it all together
Screen Design
Graphics Display Designer
l GUI design tool
l Eliminates need to
hand calculate x,y
values
l Generates output
source files
l Import / Convert
fonts and images
l MPLAB
IDE 8 plug-
in
l Java version in
development
Microchip
Graphics Library
Putting it all together
Screen Management
Creating Widgets
Recall
l ObjCreate(,,,)
l Populates a structure for
the widget
l Adds widget to bottom of
the linked list
l GOLDraw()
l Parses ACTIVE linked list
l Redraws based on state
bit settings
ID_OBJ1
ID_OBJ2
ID_OBJ3
ID_OBJN
Linked List
GUI Applications
Motor Temp
Temperature
OK
MAIN
Display Temperature
START
Change Settings
STOP
MAIN MENU
1 Room Temp
2 System Temp
3 Motor Temp
3
Select One:
Screen Management Options
Using One List
l Create every widget for every screen
l Hide old widgets and draw new
l PRO: Use static widgets and schemes
l CON: May increase draw time
OR
l Draw over old widgets
l Disable bottom widgets
l Only draw part of the screen
l Better draw times
Using Multiple Lists
l Create one list per screen and switch the active
list as needed
l ObjCreate(,,,) used to form new lists
l Use GOL management APIs
l GOLGetList() Save active list
l GOLNewList() Set pointer to null
l GOLSetList(pList) Switch active list
l CON: Must allocate memory for every object
on every screen
l CON: After switching active lists, must set the
draw bits for that screen
l GOLRedrawRec(x1,y1,x2,y2) will set draw bit for
all widgets in the defined area
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
//List pointer is null here
CreateMainMenu();
pMainMenu = GOLGetList();
GOLNewList(); //List pointer NULL
CreateTempSelect();
pTempSelect = GOLGetList();
CreateMotorTemp();
pMotorTemp = GOLGetList();
CreateSystemTemp();
pSystemTemp = GOLGetList();
CreateRoomTemp();
pRoomTemp = GOLGetList();
GOLSetList(pMainMenu);
Always use GOLNewList()
to set list pointer to NULL
BEFORE creating a new list.
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
CreateMainMenu();
CreateTempSelect();
CreateMotorTemp();
CreateSystemTemp();
CreateRoomTemp();
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
CreateMainMenu();
CreateTempSelect();
CreateMotorTemp();
CreateSystemTemp();
CreateRoomTemp();
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
CreateMainMenu();
CreateTempSelect();
CreateMotorTemp();
CreateSystemTemp();
CreateRoomTemp();
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
CreateMainMenu();
CreateTempSelect();
CreateMotorTemp();
CreateSystemTemp();
CreateRoomTemp();
pSystemTemp
pTempSelect
pMotorTemp
pRoomTemp
pMainMenu
CreateMainMenu();
CreateTempSelect();
CreateMotorTemp();
CreateSystemTemp();
CreateRoomTemp();
MotorTemp
1 Button ( 1 * 28 = 28 bytes)
2 Static Text ( 2 * 22 = 44 bytes)
1 Meter ( 1 * 40 = 40 bytes)
Total 112 bytes
Motor Temp
Temperature
OK
MAIN
System Temp
Temperature
OK
MAIN
Room Temp
Temperature
OK
MAIN
SystemTemp
1 Button ( 1 * 28 = 28 bytes)
1 Meter ( 1 * 40 = 40 bytes)
Total 112 bytes
RoomTemp
1 Button ( 1 * 28 = 28 bytes)
1 Meter ( 1 * 40 = 40 bytes)
Total 112 bytes
One List / Screen
Heap Requirements
Display Temperature
START
Change Settings
STOP
MAIN MENU
MainMenu
4 Buttons ( 4 * 28 = 112 bytes )
5 Static Text ( 5 * 22 = 110 bytes )
Total 222 bytes
1 Room Temp
2 System Temp
3 Motor Temp
3
Select One:
TempSelect
3 Buttons ( 3 * 28 = 84 bytes )
4 Static Text ( 4 * 22 = 88 bytes )
Total 172 bytes
Total Heap Required
5 screens 730 bytes
3 style schemes 60 bytes
Total 790 bytes
One List / Screen
Heap Requirements
l Create Lists on the Fly
l Use GOLFree() to delete active list
l Frees heap library uses
l Does not affect application heap
l Use ObjCreate(,,,) to form new list
l Allocate heap for largest list
l Example GUI: 282 bytes (including
styles)
l Most memory efficient method
Example
Creating lists On the Fly
WORD GOLDrawCallback(void){
...
// Determine if screen change button pressed
if(screenState == newScreen){
// Delete the active list
GOLFree(); // library function
// Create a new list
CreateMyNewScreen(); // ObjCreate(,,,) functions here
} // do useful things
}
Aplicacin Integradora
Lab Exercise 5
Expected Results
Lab Exercise 5
GUI Application
Lab 5
Pulling it all Together
l In this exercise you will
demonstrate your ability to pull
our application together by
adding code that will allow the
user to move between the
screens
Purpose
Lab 5
l Use screen states to manage screens in a
fully functional GUI
l Use GOLFree() to dynamically remove an
active linked list
l Use screen create functions to
dynamically create new screens
l If time allows, you will explore Microchips
Graphics Display Design utility
Objective
Lab 5
Procedure
Lab 5
Results
Lab 5 State Diagram
Create
LED Screen
Create
Potentiometer
Screen
Show LED
Screen
Show
Main
Menu
Show
Potentiometer
Screen
Create
Temp
Screen
Create
Main
Menu
Show
Temp
Screen
Summary
Steps for design with
Microchip Graphics Objects Library
l Use a GUI design tool to design screens, import
necessary fonts and image files, and establish style
schemes
l Configure hardware using HardwareProfile.h
l Configure Graphics Objects Layer using GraphicsConfi.h
l Place appropriate files in project
l Write application code
l Use typedefs (see next slide)
l Implement message structure
l Remember, allow GOLDraw() to finish parsing linked list before
processing messages
l Add callback functions to customize application response and
manage GUI screen states
l Compile, build and run!
Types
Type Description
XCHAR Sets type of character used in library. Types are char, unsigned
char, or short depending on setting in GraphicsConfi.h
GFX_COLOR Sets type of color used in library. Types are BYTE, WORD or DWORD
based on COLOR_DEPTH setting in GraphicsConfi.h
FONT_FLASH
Refers to fonts stored in internal FLASH
FONT_EXTERNAL
Refers to fonts stored in external memory
IMAGE_FLASH
Refers to images stored in internal FLASH
IMAGE_EXTERNAL
Refers to images stored in external memory
GOL_SCHEME
Refers to style scheme structures used by widgets
GOL_MSG
Refers to the message structure used in the librarys messaging interface
OBJ_HEADER
Refers to the first member of all widget structures. Specifies ID, location
(and dimensions), states and style scheme to be used by widget
WIDGET
Refers to the widget structures. See library help for complete listing
Words of Wisdom
l Avoid heap fragmentation
l Use GOLFree()
l Do NOT
l Manually remove widgets from active list
l Do NOT
l Modify list until GOLDraw() is complete
l Avoid weird drawing effects
l Do NOT
l Modify drawing properties until GOLDraw() has
completed the drawing sequence
l Watch the list pointers
Static Memory Use
l Define and initialize widget
structures
l Define and initialize style scheme
structures
l Must maintain linked list
l All other concepts remain
Todays class was taught using
v3.01 of the Microchip Graphics
Librarys. If you have been using
older versions, please refer to the
migration notes in the Release Notes
section. Much has changed!
Summary
Today you learned how to:
l Write programs to display images,
fonts, and primitives on LCD panel
l Write programs to display and
control widgets on LCD panel
l Create GUI application code to fully
utilize Microchip Graphics Library
FindMicrochip
ControllersforGraphics
Applications
AppNotes,Webinars,
ForumsandTraining
DevelopmentBoards
DonloadMicrochip
Applications!ibrar"
Tools
l Microchip Graphics Library v3.01
l http://www.microchip.com/mla
l MPLAB
X IDE
l http://www.microchip.com/mplabx
l MPLAB 16- and 32-bit Compilers
l http://www.microchip.com/mplabc
l Graphics Resource Converter
l 0library install path1,Microchip,Graphics,bin
Tools
l Explorer 16 Development
Board (DM240001)
l PIC24FJ256DA210
Development Board(DM240312)
l Multimedia Expansion Board
(MEB) (DM320005)
l PIC32 Starter Kits (DM320001,
DM320003-2, DM320004*)
Note: * DM320004 (PIC32 Ethernet Starter Kit) is only compatible with MEB
Tools
l MPLAB
Starter Kit for PIC24F

(DM240011)
l MPLAB Starter Kit for PIC24H
(DM240021)
l Graphics Display Board with
3.2 Display Kit (AC164127-3)
l PIC24FJ256DA210
Development Kit (DV164039)
Tools
l Graphics LCD Controller
PICtailPlus SSD1926 Board
(AC164127-5)
l Graphics Display Truly 3.2
240x320 Board (AC164127-4)
l Graphics Display Powertip 4.3
480x270 Board (AC164127-6)
l Graphics Display Prototype
Board (AC164139)
High Resolution
Displays
Truly 7 WVGA (800x480)
l Resistive 4-wire touch screen
l AR1020 Touch Controller
l Works with Epson S1D13517 Board
Part Number:
AC164127-9
Truly 5.7 VGA (640x480)
l Resistive 4-wire touch screen
l AR1020 Touch Controller
l Works with Epson S1D13517 Board and
others
Part Number:
AC164127-8
Graphics Epson
S1D13517 Board
The Graphics Controller PICtailPlus Epson
S1D13517 Board allows evaluating Microchip
Technologys solution and graphics library for
16- and 32-bit microcontrollers. The Epson
S1D13517 offers hardware acceleration for alpha-
blending, transparency, animation, multiple
buffering, and picture in picture. The kit is
compatible with the Explorer 16 development
board (DM240001) or one of the PIC32 Starter
Boards (DM320001, DM320003).
The features include:
l Graphics display controller Epson S1D13517
supporting 18-bit HR-TFT, and 9/12/18/24 bit TFT
interface
l PIC32 Starter Kit Connector
l 16 Megabit (2Mx8) serial flash memory for
additional data storage
l Display connector for interfacing with different
display boards
l PICtail Plus Interface for connecting to Explorer
16 Development Board
l PIC32 Starter Kit Connector
LCC (Low-Cost Controllerless)
Graphics Board
Driving Graphics Displays without a Graphics Controller
Interfaces to Microchip Display modules
PN: AC164144
Powered by any PIC32 Starter kit
" 80MIPS 32-bit performance
" 128KB of on-chip SRAM
" High Speed 16-bit PMP
" High Performance DMA
On Board 512KB SRAM
Can be jumpered in or out
Interfaces to Microchip Explorer 16
Support for up to WQVGA @ 16bpp color
PIC32 alone can drive QVGA @ 8bpp color
Suggested Reading
Programming 16-bit Microcontrollers in C
by Lucio Di Jasio
ISBN-10: 0750682922
ISBN-13: 978-0750682923
http://www.flyingpic24.com
Programming 32-bit Microcontrollers in C
by Lucio Di Jasio
ISBN-10: 0750687096
ISBN-13: 978-0750687096
Gracias!
Trademarks
l The Microchip name and logo, the Microchip logo, dsPIC, KeeLoq, KeeLoq
logo, MPLAB, PIC, PICmicro, PICSTART, PIC
32
logo, rfPIC and UNI/O are
registered trademarks of Microchip Technology Incorporated in the U.S.A. and
other countries.
l 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.
l Analog-for-the-Digital Age, Application Maestro, chipKIT, chipKIT logo,
CodeGuard, dsPICDEM, dsPICDEM.net, dsPICworks, dsSPEAK, ECAN,
ECONOMONITOR, FanSense, HI-TIDE, In-Circuit Serial Programming, ICSP,
Mindi, MiWi, MPASM, MPLAB Certified logo, MPLIB, MPLINK, mTouch,
Omniscient Code Generation, PICC, PICC-18, PICDEM, PICDEM.net, PICkit,
PICtail, REAL ICE, rfLAB, Select Mode, Total Endurance, TSHARC,
UniWinDriver, WiperLock and ZENA are trademarks of Microchip Technology
Incorporated in the U.S.A. and other countries.
l SQTP is a service mark of Microchip Technology Incorporated in the U.S.A.
l All other trademarks mentioned herein are property of their respective
companies.
l 2011, Microchip Technology Incorporated, All Rights Reserved.

Librerias Graficas Con PIC32 PDF

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Librerias Graficas Con PIC32 PDF

Cargado por

Copyright:

Formatos disponibles

Mauricio Jancic

FAE - Artimar Ltda.

, MAC OS, Linux

IDE, create a new project

2011 Microchip Technology Incorporated. All Rights Reserved. Slide 101

2011 Microchip Technology Incorporated. All Rights Reserved. Slide 124

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

altScheme -> EmbossDkColor = DKBLUE;

continued on next slide

String1 =Static Text \nLeft Aligned

StCreate( ST_TXT1, // Static Text Box

Starter Kit for PIC24F

También podría gustarte