IUP
resumo do curso preparado pelo Ovídio
(by Rodrigo Toledo)
IUP
1
Apresentação
• O IUP é composto de um Toolkit virtual e
uma linguagem de especificação de
Diálogos, denominada LED.
IUP
2
Conteúdo
•
•
•
•
IUP
LED
CD
LUA
IUPLUA
3
Características do IUP
• Multiplataforma
• Pequeno
• Aproximadamente 40 funções
• Prototipagem rápida
• Expansível
• O layout é especificado abstratamente
IUP
4
Layout Concreto x Layout Abstrato
• Mais utilizado (Microsoft,
Borland, Delphi, VB).
• Dependente da resolução do
sistema.
• Ao variar o tamanho da janela
os
objetos
ficam
desposicionados.
• Ferramenta de especificação
interativa (“visual”) se torna
mais simples .
IUP
• Pouco utilizado.
• Independente da resolução do
sistema.
• Rearranjo
automático
dos
elementos após alteração do
tamanho da janela.
• Sintaxe
mais
simples
e
agradável.
• Manutenção mais simples.
• Ferramenta de especificação
interativa (“visual”) se torna
mais complexa.
5
Layout Abstrato
O posicionamento dos
elementos no diálogo não é
feito através das suas
coordenadas como na
maioria dos sistemas de
interface.
Ao lado um
diálogo com centralização
horizontal do elemento
LABEL.
HBOX
FILL
LABEL
FILL
Teste
Texto Centralizado Horizontalmente
Teste
Texto Centralizado Horizontalmente
IUP
6
Fundamentos
Interfaces & Orientação à eventos
IUP
7
Sistemas de Interface com o Usuário
Elementos de interface:
Diálogo
•Botão
•Janelas
•Texto(estático ou editável)
•Ícones
•Lista
•Mouse
•Menu
•Toggle
•Radio
•Image
•Extras (Matriz, Dial, …)
•Canvas (Área de trabalho)
IUP
8
Programação Convencional e
Orientada à Eventos
início
Os comandos são
executados
segundo uma
ordem
preestabelecida e
sequencial.
captura
dados
início
captura
evento
executa
Fç evento
processa
dados
não
fim?
sim
fim
IUP
O controle do
fluxo não
pertence ao
programador da
aplicação
somente, mas
também, ao
usuário que
interage com o
programa gerando
eventos.
fim
9
Programação por Callbacks
Aplicação
inicio
captura
evento
registra
funções
executa
Fç evento
interage
c/ usuário
evento
final ?
não
Gerenciador
de callbacks
fim
IUP
retorna p/
aplicação
10
Arquitetura
Aplicação
IUP
Macintosh
Motif
otk
Windows
DOS
IUP
XWindows
11
Descrição Conceitual - Modelo
•
•
IUP
O IUP utiliza um modelo de layout abstrato baseado no paradigma boxes-andglue do processador de texto TEX. Esse modelo, aliado à linguagem de
especificação de diálogos (LED) ou do binding LUA (IUPLUA) torna a tarefa
de criação dos diálogos mais flexível e independente da resolução do sistema
gráfico.
Os elementos de interface disponíveis na versão atual podem ser divididos nas
seguintes categorias e são controlados pelos seus atributos e callbacks:
• Preenchimento (ocupação de espaços vazios dinamicamente): fill.
• Composição (definição de uma forma de exibir os elementos): hbox, vbox
e zbox.
• Agrupamento (definição de uma funcionalidade comum para um grupo de
elementos): dialog, radio, menu.
• Primitivos (interação efetiva com o usuário): button, label, text, multiline,
list, toggle, frame, canvas, image, item, submenu.
12
LED - Lingugem de Especificação de Diálogos
Linguagem de Expressões
Sintaxe simples : Nomes = Elementos[Atributos](Parâmetros ou Expressão)
Exemplo:
botao1 = BUTTON(“Botao 1”, do_bot1)
botao2 = BUTTON(“Botao 2”, do_bot2)
caixa_bot = HBOX(FILL(), botao1, FILL(), botao2, FILL())
texto_est = LABEL(“Texto estatico”)
caixa_texto = HBOX(FILL(), texto_est, FILL())
corpo_dial = VBOX(FILL(), caixa_texto, FILL(), caixa_bot, FILL())
dial_1 = DIALOG[TITLE=“Titulo”](corpo_dial)
Notas :
1. Os nomes dos atributos são obrigatoriamente dados com letras maiúsculas.
2. As variáveis “LED” não podem ser usadas mais de uma vez e já devem estar definidas.
3. Os comentários são feitos após o sinal “#”.
4. As notas acima podem ser verificadas no arquivo primitivos.led
IUP
13
Elementos de Interface IUP
Sintaxe, atributos e exemplos
IUP
14
Elemento de Preenchimento - FILL
O elemento de preenchimento FILL, ocupa os espaços
vazios dinamicamente, mantendo os elementos alinhados
e o layout inalterado, mesmo após uma mudança no
tamanho da janela.
FILL [ATRIBUTOS] ()
Principais Atributos:
•EXPAND
•SIZE
Exemplo:
caixa = HBOX(FILL(), text[VALUE=“abcd”](), FILL())
IUP
15
Elementos de Composição
Elementos que não possuem uma representação visual, mas
são fundamentais para o funcionamento do mecanismo de
especificação abstrata de layout.
• HBOX [ATRIBUTOS] (elem1, elem2, …)
Agrupa os elementos exibindo-os horizontalmente da esquerda para a direita.
• VBOX [ATRIBUTOS] (elem1, elem2, …)
Agrupa os elementos exibindo-os verticalmente de cima para baixo.
• ZBOX [ATRIBUTOS] (elem1, elem2, …)
Empilha os elementos sobrepondo-os uns aos outros. Somente o topo da
pilha é mostrado.
Atributos:
ALIGNMENT, MARGIN, SIZE e GAP (Este último só para HBOX e VBOX)
IUP
16
Elementos de Agrupamento
Obs: radio será apresentado depois, junto com toggle
IUP
17
Diálogo
Para exibir qualquer elemento de interface é necessário encapsulá-lo em
um dialog. O dialog, gerencia a interação do usuário com os elementos de
interface. A aplicação torna-se um conjunto de diálogos.
DIALOG [ATRIBUTOS] (Expressão)
Principais atributos
•TITLE
•MENU
•SIZE
•ICON
•BORDER
•CURSOR
•MENUBOX
•MINBOX
•MAXBOX
Exemplo:
dial_1 = DIALOG[TITLE=“Titulo”](corpo_dial)
IUP
18
Menu (Item, Separator e Submenu)
Agrupa 3 tipos de elementos de interface: item, submenu e separator.
Qualquer outro elemento de interface definido dentro de um menu é
ignorado.
ITEM
[ATRIBUTOS] (Título, Ação)
MENU
[ATRIBUTOS] (Item1, Item2 ,Submenu1,…, separator(),… )
SUBMENU [ATRIBUTOS] (Título, Menu)
Principais Atributos:
Exemplo:
ACTIVE & KEY
item_abre = ITEM[KEY=K_A]("Abre", acao_abre)
item_salva = ITEM[KEY=K_S]("Salva", acao_salva)
menu_secundario = MENU[ACTIVE=NO](item_abre, separator(), item_salva)
submenu_geral = SUBMENU[KEY=K_G]("Geral", menu_secundario)
item_final = ITEM[KEY=K_F]("Finaliza", acao_final)
menu_princ = MENU(submenu_geral, item_final)
dial_1 = DIALOG[MENU=menu_princ, MINBOX=NO, TITLE="Título"](corpo_dial)
IUP
19
Elementos Primitivos
IUP
20
Botão
Exibe um botão capaz de executar uma ação específica.
Sua apresentação visual pode conter um texto ou uma
imagem.
BUTTON [ATRIBUTOS] (Título, Ação)
Principais Atributos:
•ACTIVE
•IMAGE
•IMPRESS
•IMINACTIVE
•SIZE
•TITLE
•KANY
•K_* ( * - Segundo tabela
de codificação do teclado)
Exemplo:
botao1 = BUTTON("Botao 1", acao_1)
botao2 = BUTTON("Botao 2", acao_2)
caixa_bot = HBOX(FILL(), botao1, FILL(), botao2, FILL())
IUP
21
Texto Estático
Exibe um texto ou uma imagem para o usuário.
LABEL [ATRIBUTOS] (Título)
Principais Atributos:
•BGCOLOR
•FGCOLOR
•FONT
•IMAGE
•TITLE
Exemplo:
msg = LABEL[FGCOLOR="0 0 255"]("Pressione o botão para sair")
IUP
22
Caixa de Texto Editável
Exibe um campo editável de uma linha. Permite ao
programador capturar uma string qualquer digitada pelo
usuário.
TEXT [ATRIBUTOS] (Ação)
Principais Atributos:
•VALUE
•NC
•BORDER
•MASK
•CARET
•SELECTION
•SELECTEDTEXT
•KANY
Exemplo:
campo = TEXT[VALUE="1234", NC=4](acao_tecla)
IUP
23
Caixa de Texto Editável com Várias Linhas
Campo editável de uma ou mais linhas.
MULTILINE [ATRIBUTOS] (Ação)
Principais Atributos:
•VALUE
•NC
•SELECTEDTEXT
•SELECTION
•BORDER
•CARET
Exemplo:
texto = MULTILINE
[VALUE="Primeira linha\nSegunda linha", SIZE=110x50]
(acao_texto)
IUP
24
Lista
Lista de itens de dois estados (on e off). Uma ação é
gerada para cada troca de estado de um item.
LIST [ATRIBUTOS] (Ação)
Principais Atributos:
•1, 2, 3, ...
•MULTIPLE
•VALUE
•DROPDOWN
•VISIBLEITEMS
Exemplo:
pais_lista = LIST
[1=“Brasil”, 2=“Eua”, 3=“Noruega”, VALUE=1](acao_pais)
IUP
25
Botão de Dois Estados (Moldura)
Botão de dois estados (on/off). Sua apresentação visual pode conter
um texto ou uma imagem. Uma moldura (FRAME), foi usada para
envolver o elemento de interface em questão, a qual pode ser usada
em qualquer elemento.
TOGGLE [ATRIBUTOS] (Título, Ação)
Principais Atributos:
•IMAGE
•TITLE
•VALUE
Exemplo:
port = TOGGLE [VALUE=ON] (“4 Portas”, acao_equip)
ar
= TOGGLE [VALUE=OFF](“Ar Cond.”, acao_equip)
moldura = FRAME[TITLE=“Acessórios”](hbox(port, ar))
IUP
26
Botões de Dois Estados
Mutuamente Exclusivos
Este elemento exige que apenas um dos seus
toggles descendentes esteja no estado on.
RADIO[ATRIBUTOS](vbox(Toggle1, Toggle2
,…,
Togglen
,…,
))
RADIO[ATRIBUTOS](hbox(Toggle1, Toggle2
,…,
Togglen
,…,
))
Principal Atributo:
Exemplo:
VALUE
masc = TOGGLE (“Masc.”, acao_sexo)
fem = TOGGLE (“Fem.”, acao_sexo)
exclusivo = RADIO[VALUE=“fem”]( vbox(masc, fem) )
moldura = FRAME[TITLE=“Sexo”](exclusivo)
IUP
27
Imagem (Cor)
Sua apresentção visual se dá em um label, button ou
toggle
IMAGE [ATRIBUTOS] (Largura, Altura, Lista de Índices)
Principais Atributos:
0, 1, 2, 3, ... , n
Exemplo:
azul
= COLOR (0, 0, 255)
vermelho = COLOR (255, 0, 0)
xis = IMAGE[0="azul",1="255 0 0"]
( 5,5, 1,0,0,0,1, 0,1,0,1,0, 0,0,1,0,0,
0,1,0,1,0, 1,0,0,0,1)
label_xis = LABEL[IMAGE = xis]("")
IUP
28
Área de Trabalho
Este elemento, reserva uma área no diálogo para a aplicação sem a
interferência do IUP. É através desta área que o IUP se relaciona com
os sistemas gráficos como o GKS, CD, OpenGL, etc.
CANVAS [ATRIBUTOS] (Ação)
Principais Atributos:
•CURSOR
•SCROLLBAR
•POSX e POSY
•BORDER
•EXPAND
•CALLBACKS (mouse, resize, scrollbar)
Exemplo:
area_trab =
CANVAS[MOTION_CB=acao_MotionCB,BUTTON_CB=acao_ButtonCB,
RESIZE_CB=acao_ResizeCB](acao_Repaint)
IUP
29
Elementos de Interface Extras I
Elementos que servem para estabelecer regulagens ou ajustes. Uma
diferença básica entre estes elementos é que o Valuator possui limites
bem definidos.
• Dial (Disco, relógio, mostrador)
DIAL [ATRIBUTOS] (Tipo)
Tipo: HORIZONTAL, VERTICAL
ou CIRCULAR
Atributos: DENSITY, MOUSEMOVE_CB,
BUTTON_PRESS_CB,
BUTTON_RELEASE_CB
• Valuator (Estima, aprecia)
VAL [ATRIBUTOS] (Tipo)
Tipo: HORIZONTAL ou VERTICAL
Atributos: MIN, MAX, VALUE,
IUP
BUTTON_PRESS_CB,
BUTTON_RELEASE_CB, MOUSEMOVE_CB
30
Elementos de Interface Extras II
• Tabs (Tira, aba, pala)
TABS [ATRIBUTOS](elem1, elem2, ...)
elem1, elem2, …: Estes parâmetros vão ser "chaveados", devendo cada um
possuir o atributo "TABTITLE", que especifica o texto a ser mostrado na
lingüeta de seu Tab. Se este atributo for omitido, o comportamento do
Tabs é indefinido.
Atributos: TYPE, VALUE, TABCHANGE_CB
Tipos: TOP, BOTTOM, LEFT, RIGHT
• Gauge (Medida, escala)
GAUGE [ATRIBUTOS]( )
Mostra um valor percentual que pode ser
modificado para delinear uma
progressão.
Atributos: TEXT, VALUE,
SHOW_TEXT
IUP
31
Elementos de Interface Extras III
• Matrix - É uma matriz de campos alfanuméricos
editáveis. Todos os campos são do tipo string.
MATRIX [ATRIBUTOS](Ação)
Principais Atributos:
IUP
•NUMCOL
•RESIZEMATRIX
•NUMLIN
•ALIGNMENT
•MARKED
•L:C, L:0, 0:C, 0:0
•MARKED_MODE
•WIDTHDEF
•MULTIPLE
•SCROLLBAR
32
Elementos de Interface Extras IV
• ColorBrowser - Permite a seleção interativa de
cores no modelo HLS (Hue Saturation Brightness).
COLORBROWSER [ATRIBUTOS](Ação)
Principal Atributo:
IUP
RGB
33
Prática 5 - Programando em LED
•Criar o diálogo abaixo utilizando a linguagem LED. Utilize
um editor de textos como o pfe. Visualize o arquivo criado
através do programa View.
•Crie também um menu com a seguinte estrutura:
Arquivo(Gravar, Sair) e Opções(Incluir, Modificar, Remover).
Dados Pessoais
Arquivo
Opções
Nome :
End. :
Tel. :
Sexo
Masculino
Feminino
IUP
Limpa
Estado Civil
Solteiro
Casado
Viuvo
Outros
Termina
34
Diálogos Predefinidos
São diálogos com funcionalidade predefinida, usados com
muita freqüência na maior parte das aplicações. Também
serviram para manter a compatibilidade com o IntGraf,
sistema de interface anterior ao IUP. Não podem ser
usados em LED.
• IupGetFile
• IupMessage
• IupGetColor
IUP
• IupListDialog
• IupScanf
• IupAlarm
35
Atributos Relacionados a
Todos os Elementos
•
•
•
•
•
BGCOLOR
FGCOLOR
FONT
EXPAND
TIP (Informar)
Volte às práticas 3 e 4 e
coloque o mouse
sobre os elementos
visualizados.
IUP
•
•
•
•
RASTERSIZE
SIZE
KANY
K_* (Segundo
tabela de codificação
do teclado)
• ACTIVE
• VISIBLE
• WID
(Identificador do
elemento no sistema de
interface nativo)
• TITLE
• VALUE
36
Guia de Programação C - I
void main(void)
{
/* Inicializa o IUP */
if (IupOpen() == IUP_ERROR)
{
fprintf(stderr, "Error Opening IUP");
return;
}
/* Interpreta e cria os elementos descritos no arq. LED
IupLoad (“arquivo.led”);
/* Mapea e mostra o diálogo principal.Eventualmente
/* é necessário mapear o diálogo antes e nestes casos
/* usa-se a função IupMap.*/
IupShow(IupGetHandle(“dialogo_princ”));
/* Registra as funções - Próxima transparência
...
/* Estabelece a interação com o usuário */
IupMainLoop();
/* Libera memória e finaliza o IUP */
IupClose();
}
IUP
*/
*/
*/
*/
37
Guia de Programação C - II
Como a programação do IUP é feita por Callbacks, antes da rotina
IupMainLoop é necessário registrar as funções que serão chamadas
para cada ação do usuário.
Exemplo:
int quit (void)
{
return IUP_CLOSE;
}
/* Registra a função quit p/ a acao_saida
*/
IupSetFunction ("acao_saida", (Icallback)quit);
Nota: A especificação da interface que aprendemos em LED pode
ser feita em C, o que a torna menos flexível. Já existe também o
programa LED2C que a partir de uma especificação LED gera o
código C equivalente.
IUP
38
Prática 6 - Primeiro Programa
• Para exercitar a programação C necessária ao
IUP, crie um programa mínimo que exiba a
especificação construida na prática anterior.
• Construa pelo menos a callback de saída do
programa associando-a à uma opção do MENU
e à ação de click no botão “Termina”.
IUP
39
Controlando os Atributos - I
Consultando:
char *IupGetAttribute(Ihandle *elemento, char *a);
elemento: identificador do elemento de interface
a: nome do atributo
Consulta o valor de um atributo de um elemento de interface. A função
retorna o valor do atributo. Se o atributo não existe, o retorno é NULL.
Todos os valores de atributos são strings. Para dispor do Ihandle do
elemento, basta usar a função IupGetHandle (char *nome_elemento).
Exemplo:
char *vis = IupGetAttribute(IupGetHandle("dialogo"), IUP_VISIBLE);
Outras funções:
IupGetInt, IupGetFloat, IupGetAttributes, IupGetGlobal
IUP
40
Controlando os Atributos - II
Alterando:
void IupSetAttribute(Ihandle *elemento, char *a, char *v);
elemento: identificador do elemento de interface
a: nome do atributo
v: valor do atributo. Se v for igual a NULL, o atributo é retirado do elemento.
Define um atributo para um elemento de interface. O valor guardado no attributo não
é duplicado pelo IUP que guarda apenas o ponteiro especificado, assim o ponteiro
não pode ser liberado enquanto o elemento existir. Para o IUP guardar o atributo,
duplicando o ponteiro, use a função IupStoreAttribute (disponível na versão 1.8).
Exemplo:
IupSetAttribute(IupGetHandle("text1"), IUP_VALUE, "Olá!");
IupSetAttribute(indicador, IUP_VALUE, IUP_ON);
Outras funções:
IupStoreAttribute, IupSetAttributes, IupSetfAttribute, IupSetGlobal
IUP
41
Mais sobre Atributos
(StoreAttribute x SetAttribute)
• A função IupGetAttribute retorna um ponteiro que
funciona como um buffer interno do IUP, assim a segunda
chamada escreve por cima da área retornada pela primeira.
IUP
42
Retornos de uma Callback
São valores que devem ser retornados no final de cada
callback.
IUP_DEFAULT: prossegue normalmente com a interação
com o usuário. Caso os outros valores de retorno não sejam
aplicados, deve-se retornar sempre este valor.
IUP_CLOSE: faz a função IupMainLoop retornar o
controle para a aplicação. Isso geralmente faz com que a
aplicação termine, portanto deve-se usar com atenção.
IUP_IGNORE: faz com que o sistema nativo ignore a ação
daquela callback, aplicável somente para algumas ações.
Veja a documentação de cada ação para saber se é aplicável
à aquela ação.
IUP
43
Callbacks Especiais
IUP_IDLE_ACTION
Ação predefinida do IUP, gerada quando não há eventos.
IUP_DEFAULT_ACTION
Ação predefinida do IUP, gerada sempre que uma ação não
tiver uma função associada.
Junto com a função
IupGetActionName, pode ser útil para verificar eventuais
erros de digitação no registro de Callbacks.
IUP
44