TUTORIAL GUI MATLAB

1! INTRODUO
!
! Tutorial referente ferramenta GUI (Graphics User Interface - Interface Grfica do
Usurio) do Matlab. Tal ferramenta permite a construo de ambientes interativos ao
usurio, facilitando o uso para no especialistas e provendo recursos como pequenos
sistemas de superviso industrial que podem ser compilados e executados em qualquer
computador mesmo que no possua o Matlab instalado.
! Aliados aos elementos grficos o desenvolvedor pode fazer uso de todas as
ferramentas disponveis no Matlab atravs das chamadas de funes (callbacks). O
ambiente do tipo WYSIWYG (What You See Is What You Get - O que voc v o que
voc tm), ou seja, durante o projeto pode-se observar a prvia em tempo real de como
ficar a verso final da interface.

2! ACESSANDO O AMBIENTE GUIDE

!
! Para que se faa o acesso do ambiente de construo de interfaces, deve-se digitar
o comando guideno workspace:

>> guide
!
! Surge uma tela com as opes mais comuns para iniciar-se um projeto, para este
tutorial, mantm-se as configuraes como esto e confirma-se em ok.

Figura 1 - Iniciando um novo projeto.

ARTHUR SCHULER DA IGREJA! 1

! A prxima tela a tela inicial de projetos, neste ambiente so configurados os
elementos que sero visveis ao usurio.

Figura 2 - Tela inicial do ambiente grfico.

3! CALLBACKS !
!
! Todo elemento adicionado interface realizar um retorno de chamada (callback)
quando acionado, ou seja, caso um boto for adicionado ao projeto, quando o usurio
clicar em tal boto, um trecho de cdigo ser executado. Este trecho de cdigo escrito
em um arquivo .m padro do Matlab mas com delimitaes para cada elemento.

4! EXEMPLOS

4.1! BOTO INCREMENTANDO VARIVEL

!
! Neste primeiro exemplo ser construda uma interface composta de um boto e um
edit (campo de caracteres) onde a cada vez que o usurio clicar no boto ser
incrementado em uma unidade o contador presente no edit.
! Inicialmente deve-se selecionar um boto no menu de elementos presente no lado
esquerdo da tela principal do GUI:

Figura 3 - Selecionando um boto no menu de elementos.

ARTHUR SCHULER DA IGREJA! 2
! Uma vez selecionado o boto basta clicar em qualquer ponto da tela do projeto e
arrastar o mouse at o boto atingir a dimenso desejada.

Figura 4 - Boto adicionador ao projeto.

! A prxima tarefa consiste em alterar algumas das propriedades do boto como o

texto padro Push Button. Para acessar o menu de edio de propriedades basta clicar
2 vezes em cima do elemento, um menu surgir na tela.

Figura 5 - Edio de propriedades do boto.

! Para editar o texto basta alterar a propriedade String, neste caso foi alterada para
a palavra ADICIONA.
! O prximo passo consiste em adicionar um campo de edio de caracteres (edit),
para tal basta selecionar este elemento no menu e posicion-lo no projeto.

Figura 6 - Selecionando o elemento edit.

ARTHUR SCHULER DA IGREJA! 3

 Figura 7 - Edit adicionado interface.

! Da mesma forma que o boto, deve-se alterar a propriedade do campo de texto para
que se inicie com o nmero 0. Basta editar a propriedade Stringe alterar para 0.

Figura 8 - Edit com valor inicial configurado.

! Uma vez adicionados os elementos, deve-se editar o cdigo de callback de cada um

dos elementos, neste caso apenas o boto ter ao para que o projeto seja concludo.
Para editar o callback de um elemento, basta clicar com o boto direito sobre este e
acessar a opo View callbacks - Callback.

Figura 9 - Acessando rea de edio de cdigo do boto ADICIONA.

!
! Uma tela com um arquivo .m aberta com diversos comentrios, esses comentrios
separam o trecho de cdigo para cada elemento do sistema, neste caso o cursos aparece
na edio do boto.

Figura 10 - Funo de callback ao pressionar o boto.

! Abaixo destes comentrios deve ser escrito o seguinte cdigo:

numero_atual = get(handles.edit1,'String');
numero_atual = str2num(numero_atual);
numero_atual = numero_atual+1;
numero_atual = num2str(numero_atual);
set(handles.edit1,'String',numero_atual);

ARTHUR SCHULER DA IGREJA! 4

! O sistema de controle do GUI gerido por uma estrutura chamada handles, esta
estrutura possui todos os atributos dos componentes adicionados pelo projetista. Para
alterar uma propriedade de um elemento via cdigo deve-se fazer a alterao dentro
desta estrutura com os comandos get (obter) e set (definir). A regra geral para o
comando get :

get(handles.TAG_DO_ELEMENTO, 'PROPRIEDADE_DO_ELEMENTO');

! Para o exemplo anterior, foi atribudo varivel numero_atual o contedo do

campo String (texto) do elemento edit1.
! Para o comando set a regra geral :

set(handles.TAG_DO_ELEMENTO, 'PROPRIEDADE_DO_ELEMENTO', VALOR);

!
! Dessa forma o comentrio do cdigo anterior :

1 linha - Obtm o contedo do campo edit1 e armazena na varivel numero_atual;

2 linha - Converte a varivel numero_atual de texto para nmero visto que todo
contedo de um campo edit do tipo texto por padro;
3 linha - Soma um ao valor atual da varivel;
4 linha - Converte de nmero para texto;
5 linha - Define no elemento edit1, no campo String o novo valor;

! Para testar o projeto basta apertar F5 ou clicar no boto run do menu do Matlab.
A interface criada apresentada e a cada clique do mouse o valor incrementado em
uma unidade.

Figura 11 - Projeto sendo testado.

4.2! PLOTANDO UM GRFICO

!
! Neste exemplo ao selecionar um marcador o usurio far com que um grfico
senoidal seja plotado no programa.
! O primeiro passo consiste em adicionar o elemento chamado radiobutton e
posicion-lo no projeto. Aps ser adicionado deve-se editar o campo String e substituir o
texto padro por PLOTAR.

Figura 12 - Elemento radiobutton depois de editado.

! O prximo elemento o eixo de plotagem, este elemento est no menu com o nome de Axes, deve-
se posicion-lo no projeto ao lado do boto.

ARTHUR SCHULER DA IGREJA! 5

 Figura 13 - Prvia do projeto com rea para plotar e boto de acionamento.

! O elemento responsvel por ativar o grfico ser o boto, dessa forma deve-se
editar a funo callback do mesmo com o seguinte cdigo:

x=0:0.1:10;
y=sin(x);
plot(x,y);

Figura 14 - Resultado prtico do exemplo.

4.3! ATUALIZAR UM GRFICO EM TEMPO REAL

!
! Neste exemplo um grfico ser alterado sempre que o usurio mover o elemento
slider. Este elemento permite configurao de valores com o mouse atravs de uma
barra de rolagem.
! O primeiro passo adicionar o elemento slider na tela de projeto e configurar
alguns de seus parmetros:

Value = 5;
Min = 1;
Max = 10;

ARTHUR SCHULER DA IGREJA! 6

! Deve tambm ser adicionado um eixo para plotar grficos, a configurao prvia do
projeto vista na Figura 15.

Figura 15 - Prvia do projeto 4.3.

!
! O elemento que controla o grfico o slider, dessa forma em seu callback deve
ser definido:

limite = get(handles.slider1,'Value');
x=0:0.1:limite;
y=sin(x);
plot(x,y);

! Dessa forma a cada novo valor configurado pelo usurio o grfico reconfigurado.

Figura 16 - Projeto 4.3 com slider.

ARTHUR SCHULER DA IGREJA! 7