Escolar Documentos
Profissional Documentos
Cultura Documentos
Alexandre Fioravante de Siqueira DFQB FCT UNESP Messias Meneguette Junior DMEC FCT UNESP
Sumrio
Prefcio 1. Interfaces Grficas com o Usurio no Matlab
1.1. O que uma GUI? 1.2. Os modos de criao 1.3. Projetando sua GUI
11
14 21
ii
Prefcio
O Matlab, criado no fim dos anos 1970 por Cleve Moler (um dos fundadores da MathWorks, Inc.), destinado a clculos com matrizes. No entanto, reconhecido mundialmente como uma das melhores ferramentas para o processamento matemtico. Voltado s reas de engenharia, fsica, estatstica, economia, entre muitas outras, o Matlab no apenas um pacote de computao e plotagem; este software conta com diversas extenses (as chamadas toolboxes) que o tornam muito verstil e poderoso. Algumas dessas extenses, por exemplo, so a signal processing toolbox, image processing toolbox, data acquisition toolbox, neural network toolbox. Com tantas opes disponveis, o Matlab se tornou uma vantajosa ferramenta que permite, mesmo aos usurios com capacidades elementares de programao, produzir grficos complexos e resolver problemas de elevado grau de dificuldade. Softwares profissionais em sua maioria contam com interfaces grficas intuitivas, de fcil acesso. Linguagens de programao bem conhecidas, como Pascal, Basic, Clipper e COBOL possuem ferramentas voltadas para a criao de interfaces grficas com o usurio (solues disponveis respectivamente, para cada linguagem: Delphi, Visual Basic, FlagShip e AcuCobol). Embora o foco dos programadores Matlab seja a resoluo de problemas matemticos avanados, o Matlab possibilita tambm a construo de sofisticadas interfaces grficas. Este trabalho tem como objetivo fornecer um curso introdutrio sobre a criao de interfaces grficas com o usurio (GUIs), assunto por vezes no conhecido entre os programadores Matlab. Aps o estudo do material, espera-se que o programador desenvolva interfaces grficas bsicas, e tambm consiga se situar na busca de informaes mais avanadas sobre a criao de GUIs.
iii
Figura 1. Um esboo de interface grfica com o usurio. O rascunho em um papel simples, mas independente da complexidade da GUI, sempre um bom meio de comear. Depois de projetada, hora de estruturar sua GUI no Guide.
Figura 2. A tela inicial do Guide, exibindo uma GUI em branco. Quando uma GUI criada no Guide, ele se encarrega de criar dois arquivos: o arquivo do corpo da interface grfica (que salvo como uma figura de extenso .fig, do Matlab) e outro arquivo contendo funes que controlam como a GUI trabalha (salvo como um arquivo de funo .m, do Matlab). Este arquivo fornece cdigos para iniciar a GUI e contm a estrutura para os callbacks da interface (as rotinas que so executadas quando o usurio interage com um componente da GUI).
Figura 3. A GUI botaotexto.fig, e seu respectivo arquivo .m no Matlab Editor. Esta interface grfica exibe um boto, uma caixa de edio e um rtulo de texto. O Matlab chama esses objetos de pushbutton, edit text e static text, respectivamente. Observe, no arquivo botaotexto.m, os callbacks j citados anteriormente. Quando clicarmos o pushbutton, ativaremos seu callback, que determinar a ao do boto. Da mesma forma, quando digitarmos alguns caracteres na edit text e pressionarmos Enter, ativaremos seu callback. Note que static text no tem sua funo callback. Tenha em mente que nem sempre todos os callbacks so utilizados; veremos isso em detalhes adiante.
Objeto
Descrio
Por vezes chamado de boto de controle, um componente grfico que normalmente contm um rtulo de texto. Clicando-o, o Matlab executa a ao definida pelo callback do objeto.
Controles grficos
Sliders costumam ser utilizados para selecionar um valor em um intervalo de valores. Cada mudana de valor executa a ao definida no callback do objeto.
O boto de rdio um tipo de boto de chave, que contm um rtulo e um crculo ao lado deste rtulo. Quando selecionado, o crculo preenchido. Botes de rdio costumam ser utilizados para selecionar uma entre um grupo mutuamente exclusivo de opes. Cada clique em um boto de rdio executa o callback definido para o objeto.
Estas caixas consistem em botes com um rtulo e uma caixa quadrada ao lado deste rtulo. Quando ativado, o controle alterna entre preenchido e limpo. As caixas de controle costumam ser usadas para indicar o estado de uma opo, ou selecionar vrias opes no-exclusivas. Cada clique em um boto de rdio executa o callback definido.
Controles grficos
Exibe texto em uma caixa, de forma que este texto possa ser editado ou substitudo. Quando o usurio pressiona o boto Enter, o callback definido executado.
So teis para apresentar uma lista de escolhas mutuamente exclusivas ao usurio. Estes menus podem ser colocados em qualquer lugar da janela principal.
Parecem caixas de texto de mltiplas linhas que permitem que os usurios selecionem itens individuais ou mltiplos de uma lista com um clique do mouse. O callback definido executado quando um valor da caixa selecionado.
Os botes de chave so idnticos aos botes simples, exceto pelo fato de alternarem entre dois estados (pressionado e no pressionado). Como no pushbutton, cada clique do mouse executa o callback definido.
Elementos estticos
Eixos (axes) Os eixos criam um conjunto para exibio de dados. Para os eixos NUNCA so definidos callbacks.
O rtulo de texto cria uma rea para exibio de um conjunto de caracteres. Nestes rtulos podem ser exibidos dados coletados, por exemplo, de uma edit text, ou resultados de operaes. Contudo, como para os axes, no so definidos callbacks para os rtulos de texto.
Elementos estticos
Painis, chamados de frames em algumas verses do Matlab, so reas destinadas a agrupar conjuntos de componentes. Tambm no geram callbacks.
Painel (panel)
Tabela 1. Descrio dos componentes mais usados na criao de uma GUI. Na Figura 4, como exemplo, temos uma GUI com todos esses componentes.
Figura 4. Interface grfica com todos os componentes descritos na Tabela 1. Conhecendo estes componentes e utilizando-os convenientemente, estaremos a um passo da criao de GUIs teis e funcionais. Depois de projetar a GUI, basta programar as aes de cada componente. Entretanto, algumas vezes interessante mudar a cor de fundo da janela, ou o tipo de fonte de um rtulo de texto, entre outros aspectos da interface. Podemos fazer isso no Guide utilizando o inspetor de propriedades dos componentes.
Figura 5. O inspetor de propriedades do Guide. As propriedades exibidas referem-se a um pushbutton. O inspetor de propriedades exibe as propriedades do objeto, e se alterar conforme outros objetos so clicados. Podemos alterar os valores das propriedades como necessrio. Na Tabela 2, dada abaixo, temos algumas propriedades compartilhadas pela maioria dos componentes descritos na Tabela 1.
Propriedade do componente
BackgroundColor
Descrio
Especifica a cor do plano de fundo do objeto. Existe um valor predefinido, e outro valor pode ser escolhido diretamente em uma paleta de cores ou especificando-se valores numricos (HSB ou RGB).
Callback
Enable
Especifica se o objeto pode ser selecionado ou no. Se o objeto em questo no est habilitado, ele no responder ao clique do mouse ou a entrada de dados do teclado. Possveis valores so on, off e (em verses mais recentes) inactive.
Propriedade do componente
FontAngle
Descrio
Um conjunto de caracteres contendo o ngulo da fonte do texto exibido no objeto. Valores possveis so normal, italic e oblique.
FontName
FontSize
Um nmero que especifica o tamanho da fonte exibida no objeto. O tamanho da fonte especificado em pontos, por padro.
FontWeight
Um conjunto de caracteres contendo a espessura da fonte exibida no objeto. Valores possveis so light, normal, demi, e bold.
ForegroundColor
Especifica a cor do plano da frente do objeto. Da mesma forma que para BackgroundColor, outro valor pode ser escolhido por uma paleta de cores ou com valores numricos.
HorizontalAlignment
Especifica o alinhamento horizontal do texto contido no objeto. Possveis valores so left, center e right.
Max
Min
Position
Especifica a posio do objeto na tela, nas unidades especificadas pela propriedade Units. Esta propriedade constitui de um vetor de 4 elementos, no qual os dois primeiros elementos so as posies x e y da borda inferior esquerda do componente (relativos janela que contm o objeto), e os ltimos so a largura (width) e a altura (height) do componente.
Tag
O nome do objeto. Em qualquer funo pertencente GUI, quando quisermos nos referir a um componente qualquer, usaremos o nome dado em Tag para este objeto.
Propriedade do componente
TooltipString
Descrio
Especifica o texto de ajuda que ser exibido quando o usurio deixa o ponteiro do mouse por determinado tempo sobre o objeto.
Units
As unidades usadas para descrever a posio da janela e de seus componentes. Possveis valores so inches, centimeters, normalized, points, pixels ou characters. O valor padro em verses mais recentes characters; em verses anteriores este valor pixels.
Value
O valor atual do componente. Para botes de chave, caixas de controle e botes de rdio, o valor max quando o boto est ativado e min se o boto est desativado. Outros controles possuem significados diferentes para este termo.
Visible
Tabela 2. Propriedades comuns maioria dos componentes dados pelo Guide. Conhecendo estas propriedades, podemos comear a customizar a aparncia da interface grfica.
10
Figura 6. O manipulador de menus do Guide, Menu Editor. A Figura 7 mostra exemplos de menus padro no Menu Editor, e a interface grfica com um menu de contexto ativado. importante saber que, para os menus de contexto trabalharem da maneira esperada, devemos alterar a propriedade UIContextMenu do componente ao qual queremos associar tal menu.
11
Figura 7. Menus padro e de contexto criados no Menu Editor. Depois de construdos, podemos trabalhar com algumas propriedades dos menus, a fim de deixar a interface ainda mais intuitiva.
Figura 8. As opes separator above this item e check mark this item selecionadas para o subitem 2, e a interface grfica resultante.
12
Quando lidamos com menus, comum observarmos a presena de atalhos que aparecem na forma de letras sublinhadas. As letras mnemnicas, como so chamadas, servem para agilizar o acesso ao menu. Para utiliz-las, pressionamos ALT e a letra correspondente ao item de menu que desejamos acionar. Para implementar a funcionalidade das letras mnemnicas no Menu Editor do Guide, simplesmente colocamos o caractere & imediatamente antes da letra desejada. Por exemplo, na interface exibida na Figura 8, se quisermos que o menu Item 2 tenha como atalho a combinao ALT + T, escrevemos I&tem 2 na propriedade Label do Menu Editor. Note que, em tempo de execuo, o atalho apenas aparecer quando pressionarmos ALT. Na Figura 9, temos o exemplo descrito acima na GUI botaotexto.
Figura 9. Exemplo de interface grfica com uma letra mnemnica e a correspondente entrada no Menu Editor.
13
Figura 10. A GUI botaotexto, a ser utilizada no Exemplo 1. Neste exemplo, quando o boto Transfere for pressionado, o texto digitado na caixa de edio edit1 ser copiado para o rtulo de texto text1. Para isso, o callback do boto pushbutton1 dever conter os seguintes comandos: % --- Executes on button press in pushbutton1. function pushbutton1_Callback(hObject, eventdata, handles) % hObject handle to pushbutton1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) texto = get(handles.edit1,'String'); set(handles.text1,'String',texto);
14
Exemplo 2: Todos os botes de rdio esto selecionados? Os botes de rdio geralmente so exclusivos; ou seja, quando um clicado, os outros relacionados quele so desativados. Isso no implementado automaticamente, o que requer esforo extra de nossa parte. Neste exemplo, veremos qual a programao necessria a fim de que este problema no acontea na nossa interface. Na Figura 11, a interface grfica ilustra o problema que gostaramos de evitar. A propriedade String de radiobutton1, radiobutton2 e radiobutton3 foi alterada para Sim, No e Talvez, respectivamente.
Figura 11. A GUI botaoradio, a ser utilizada no Exemplo 2. Editaremos os callbacks de radiobutton1 desta forma: % --- Executes on button press in radiobutton1. function radiobutton1_Callback(hObject, eventdata, handles) % hObject handle to radiobutton1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of radiobutton1 set(handles.radiobutton1,'Value',1); set(handles.radiobutton2,'Value',0); set(handles.radiobutton3,'Value',0); Por sua vez, os callbacks de radiobutton2 sero: % --- Executes on button press in radiobutton2. function radiobutton2_Callback(hObject, eventdata, handles) % hObject handle to radiobutton2 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB
15
% handles GUIDATA)
% Hint: get(hObject,'Value') returns toggle state of radiobutton2 set(handles.radiobutton1,'Value',0); set(handles.radiobutton2,'Value',1); set(handles.radiobutton3,'Value',0); E finalmente, os callbacks de radiobutton3: % --- Executes on button press in radiobutton3. function radiobutton3_Callback(hObject, eventdata, handles) % hObject handle to radiobutton3 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hint: get(hObject,'Value') returns toggle state of radiobutton3 set(handles.radiobutton1,'Value',0); set(handles.radiobutton2,'Value',0); set(handles.radiobutton3,'Value',1); Com isso, os botes de rdio sero selecionados um por vez.
16
Exemplo 3: Um simples contador de cliques Continuando a interao de botes com outros objetos, agora teremos um contador de cliques. A interface grfica deste contador dada abaixo, na Figura 12. A propriedade String de text1 e de pushbutton1 foi alterada para Cliques: 0 e Clique aqui, respectivamente, e a propriedade FontSize dos dois objetos foi alterada para 12.
Figura 12. A GUI contaclique, a ser utilizada no Exemplo 3. Os callbacks de pushbutton1 sero: % --- Executes on button press in pushbutton1. function pushbutton1_Callback(hObject, eventdata, handles) % hObject handle to pushbutton1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Declara e inicializa a varivel para armazenar a contagem persistent contador if isempty(contador) contador = 0; end % Atualiza a contagem contador = contador + 1; % Cria o novo texto str = sprintf('Cliques: %d',contador); % Atualiza o rtulo de texto set(handles.text1,'String',str);
17
Exemplo 4: Um slider ditando valores Neste exemplo, veremos como fazer para que um slider mostre valores entre um intervalo de nmeros em um rtulo de texto. A interface grfica a ser utilizada dada na Figura 13. A propriedade String de text1 foi modificada para 0.00, e a propriedade FontSize, para 16. As propriedades Min e Max de slider1 foram alteradas, respectivamente, para -10 e 10.
Figura 12. A GUI valorslider, a ser utilizada no Exemplo 4. Para que a interface retorne os valores, os callbacks de slider1 sero: % --- Executes on slider movement. function slider1_Callback(hObject, eventdata, handles) % hObject handle to slider1 (see GCBO) % eventdata reserved - to be defined in a future version of MATLAB % handles structure with handles and user data (see GUIDATA) % Hints: get(hObject,'Value') returns position of slider % get(hObject,'Min') and get(hObject,'Max') to determine range of slider % Encontra o valor do slider valor = get(handles.slider1,'Value'); % Copia o valor no rtulo de texto str = sprintf('%.2f',valor); set(handles.text1,'String',str);
18
Exemplo 5: Reinventando a roda com as caixas de dilogo O ltimo exemplo mostra as caixas de dilogo predefinidas pelo Matlab, que so prticas e facilmente utilizveis. A Tabela 3 exibe um resumo das caixas predefinidas mais comuns.
Funo
dialog
Descrio
Cria uma figura para caixa de dilogo ou GUI.
errordlg
helpdlg
inputdlg
listdlg
uigetfile
uiputfile
uisetcolor
uisetfont
warndlg
Caixa de advertncia.
Tabela 2. Propriedades comuns maioria dos componentes dados pelo Guide. Alguns exemplos da utilizao dos comandos para incorporar essas caixas de dilogo sua GUI: dialog: >> dialog errordlg: >> errordlg('String de erro', 'Nome da janela')
19
helpdlg >> helpdlg('String de ajuda', 'Nome da janela') inputdlg: >> mapa de >> >> >> >> listdlg >> d = dir; >> str = {d.name}; >> listdlg('PromptString','Selecione um arquivo:','SelectionMode','single','ListString',str) uigetfile >> uigetfile({'*.m;*.fig;*.mat;*.mdl', 'Todos os arquivos MATLAB (*.m, *.fig, *.mat, *.mdl)'; '*.m', 'Arquivos M (*.m)'; '*.fig','Figuras (*.fig)'; '*.mat','Arquivos MAT (*.mat)'; '*.mdl','Modelos (*.mdl)'; '*.*', 'Todos os arquivos (*.*)'}, 'Escolha um arquivo'); uiputfile >> uiputfile({'*.m;*.fig;*.mat;*.mdl', ' Todos os arquivos MATLAB (*.m, *.fig, *.mat, *.mdl)'; '*.*', 'Todos os arquivos (*.*)'}, 'Salvar como'); uisetcolor >> hText = text(.5,.5,'Sou muito feliz com o Matlab!'); >> uisetcolor(hText, 'Cor do texto') uisetfont >> texto1 = uicontrol('style', 'text', 'string', 'XxYyZz'); >> uisetfont(texto1, 'Alterar Fonte'); warndlg >> warndlg('String de aviso', 'Nome da janela')
prompt = {'O tamanho da matriz para x^2:','Nome do cores:'}; nome = 'Entrada para funo de picos'; numlinhas = 1; resp = {'20','hsv'}; resposta = inputdlg(prompt, nome, numlinhas, resp);
20
21
Referncias bibliogrficas
[1] Ashi, R. Y. A., Ameri, A. A. Introduction to Graphical User Interface (GUI), UAE University. [2] Hanselman, D., Littlefield, B. R. Mastering Matlab 6, Prentice Hall, 2000. [3] Marchand, P., Holland, O. T. Graphics and GUIs with Matlab, Chapman & Hall, 2003. [4] Vaz Junior, C. A. Desenvolvimento de Interface Grfica em Ambiente Matlab, 2005.