Gua de ejercicios correspondiente a la practica 4

Mtodos Numricos y Programacin Digital.

Ciclo 01/2011

(GUIDE) Graphical User Interface development environment

El GUIDE es el ambiente de desarrollo de interfaz de usuario en Matlab y nos proporciona
herramientas las cuales nos permiten crear GUIs.
Cuando abrimos un GUI con el GUIDE, Matlab despliega el rea de diseo a la cual nos
referiremos como formulario. Tambin nos proporciona un conjunto de herramientas tales
como botones, cuadros de texto, textos estticos etc.
Como comenzar

Esta imagen muestra el rea de dibujo en la cual se irn colocando botones, cuadros de
texto, grficos, entre otras herramientas.

Cada elemento que se coloque en la ventana anterior generar una cantidad de lneas de
cdigo dentro de un m.file que describe las propiedades de la interfaz creada. Es al
interior de este cdigo donde el programador asignara acciones a cada botn, a los
cuadros de texto y a las figuras que desee utilizar. La imagen siguiente muestra el m.file
que se crea al momento de guardar el archivo GUI que se ha elaborado.

Cuadro de Herramientas:
En este cuadro podemos encontrar cada uno de los controles que se utilizaran para
construir la interfaz grafica del usuario. Estos controles son programables a travs de los
callback (funciones que se ejecutan cuando el usuario activa o usa controles que se
encuentran en la GUI). A continuacin se presenta una breve descripcin de algunos
controles.(Luego en la prctica se aprender como utilizarlos)

Push Buttons
Estos generan una accin (antes programada) cuando el usuario lo presiona.

Radio Buttons
El uso comn de estos es usarlos para seleccionar determinadas opciones las cuales son
excluyentes entre si, es decir solamente puede estar seleccionada una a la vez.

Check Boxes
Estos se usan de forma similar a los Radio Buttons, con la salvedad de que estos pueden
ser no excluyentes entre s.

Edit Text
Son controles los cuales permiten al usuario digitar cadenas de texto o ingresar valores
numricos, es decir controles que manejan entradas del usuario para luego utilizarlas en
la codificacin

Static text
Los textos estticos son utilizados como etiquetas y para imprimir salidas de cadena, el
contenido de estos no puede ser modificado por el usuario.

Slider
Esta opcin acepta como entrada datos numricos con un rango que se especifica. Esta
barra puede moverse manteniendo presionado y moviendo el mouse sobre ella.

Frames
Son cajas que delimitan regiones y son utilizadas principalmente para separar
por grupos varios controles para mayor facilidad de diseo y presentacin para el usuario.

List boxes
Despliegan una lista antes creada por el programador y permite al usuario seleccionar
algn elemento de esta misma.

Pop-Up Menus
Este despliega opciones cuando hacemos clic en la flecha que posee el control.
Estos se programan por lo general con la sentencia switch

Axes
Excelente para controlar objetos grficos y cada una de sus caractersticas.

Ejemplo1:
Crear un programa (con GUI) que teniendo como entrada una funcin f(x), despliegue la
derivada de esa funcin, la integral y Fourier. Si el usuario quiere cambiar de funcin debe
existir un botn que limpie las entradas y otro para poder salir de la interfaz grfica.

Para empezar creamos una nueva figura y agregamos un Static Box a un lado ponemos
un Text Box y al lado del Text Box ponemos un Push Button, debajo de estos controles
ponemos 6 Static Text y finalmente agregamos dos Push Buttons; y lo guardamos como:
Calculadora.fig, al finalizar tendremos una interface como la que se muestra a
continuacin:

En el primer Static Text cambiamos sus propiedades con el

Inspector de Propiedades y modificamos el String a: Funcin.
(La figura de la izquierda ejemplifica esta accin) De ah a el
Text Box le cambiamos la propiedad de Strig a un espacio en
blanco, y al primer Push Button le cambiamos el String a:
Calcular.
En el siguiente orden modificamos las propiedades de String
de cada Static Text:
String: Derivada
String:
String: Integral
String:
String: Fourier
String:

Finalmente para el Push Button del lado izquierdo modificamos la propiedad String a:
Limpiar y al Push Button del lado derecho String a: Salir.
Ahora vamos a editar el callback del botn salir y agregamos el cdigo necesario para
cerrar la ventana, luego editamos el callback del botn Limpiar, cuya accin es limpiar la
caja de texto de la funcin y los resultados de cada operacin.
Para hacer ello hay que considerar agregar un identificador a cada Tag de cada control,
esto es, poner un nombre a cada control para luego llamarlo e identificarlo. Para ello
seleccionamos Tag en el Inspector de propiedades. Primero editamos el Tag de nuestro
control de la caja de texto por: la_ecuacion. Y para los Static Text que no tienen texto
modificamos sus Tag en el siguiente orden por:
res_derivar
res_integrar
res_fourier
Ahora es posible saber que va a pasar con cada Static Text al presionar el botn Limpia.
El algoritmo en general para limpiar sera:
1. Definir variables
2 - Limpiar Variables
3 - Buscar los controles con el Tag
4. Definir limpia
5 - Limpiar controles
La sintaxis en general para activar un control es:
Variable = findobj ( gcbf, 'Tag', 'Nombre-de-Tag' ) ;
Lo cual nos indica que primero crea una variable local la cual contiene las propiedades del
objeto cuyo Tag es: Nombre-de-Tag, con esto ya hemos activado nuestro control, ahora
hay que regresar la accin; para ello la sintaxis es:
set ( Variable , ' Propiedad' , Operacin ) ;
En el m.file que describe la GUI que se ha creado, se debe buscar las lneas
correspondientes al push botton 2 y ah se hacen los siguientes cambios:

% --- Executes on button press in pushbutton2.

function pushbutton2_Callback(~, ~, ~)
% hObject
handle to pushbutton2 (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles
structure with handles and user data (see GUIDATA)
%limpieza de variables
clear;
clear global;
%Creando controladores
para_derivada=findobj(gcbf, 'Tag','res_derivada');
para_integral=findobj(gcbf, 'Tag','res_integral');
para_fourier=findobj(gcbf, 'Tag','res_fourier');

%Creando limpia
limpia=' ';
%Hacer limpia
set(para_derivada, 'String', limpia);
set(para_integral, 'String', limpia);
set(para_fourier, 'String', limpia);

Hasta el momento no hemos pedido datos o informacin, el algoritmo para obtener la

ecuacin es:
1. Defino variables
2. Obtengo datos (Ecuacin)
Para lograr ello se usa la siguiente instruccin:
Variable = eval ( get (gcbo, 'String' ) );
Lo que significa que creamos una variable donde vamos a almacenar la informacin que
le llegue a la caja de texto para luego utilizarla. Hay que recordar que aqu es necesario
definirla como una variable de tipo global.(que puede ser reconocida por cualquier
programa)
function la_ecuacion_Callback(~, ~, ~)
% hObject
handle to la_ecuacion (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,'String') returns contents of la_ecuacion as text
%
str2double(get(hObject,'String')) returns contents of
la_ecuacion as a double
global ecuacion ;
syms x
ecuacion=eval(get(gcbo,'String'));

Finalmente llevaremos a cabo las operaciones correspondientes, las que se ejecutan al

presionar el botn Calcula. Para ello editamos el callback segn el siguiente algoritmo:
1 - Obtengo variables de la ecuacin
2. Busco controles con el Tag
3. Hago clculos
4. Presento resultados
Usando las instrucciones:
Preparamos las variables a usar: global ecuacion x;
syms x;
Obtengo el control de la derivada
para_derivada = findobj ( gcbf, 'Tag', 'res_derivar' );
Realizo el clculo de la derivada:
derivada1 = diff (ecuacion);

Ahora preparo el resultado para poderlo desplegar en forma de carcter usando la

instruccin char() derivada2 = char (derivada1). Finalmente despliego el resultado de la
derivada: set (para_derivada, 'String', derivada2). Y realizo la misma operacin para los
otros dos clculos.
function pushbutton1_Callback(~, ~, ~)
% 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)
%Obtenemos la ecuacin
%Realizacin de Clculos
%Se obtiene la funcin
global ecuacion;
syms x;
para_derivada=findobj(gcbf, 'Tag','res_derivada');
para_integral=findobj(gcbf, 'Tag','res_integral');
para_fourier=findobj(gcbf, 'Tag','res_fourier');
%haciendo calculos de derivadas
derivada1=diff(ecuacion);
%Convietiendo a caracter
derivada2=char(derivada1);
%haciendo calculos de integrales
integral1=int(ecuacion);
%Convietiendo a caracter
integral2=char(integral1);
%haciendo calculos fourier
fourier1=fourier(ecuacion);
%Convietiendo a caracter
fourier2=char(fourier1);
%Se presentan resultados
set(para_derivada, 'String', derivada2);
set(para_integral, 'String', integral2);
set(para_fourier, 'String', fourier2);

Para el botn salir el algoritmo es el siguiente:

function pushbutton3_Callback(~, ~, ~)
% hObject
handle to pushbutton3 (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles
structure with handles and user data (see GUIDATA)
close(gcbf)

Al final la calculadora se observara de la siguiente manera, para ejecutarla nada ms se

digita el nombre con el cual se ha guardado el archivo en la ventana de comandos; de
esta forma:
>> calculadora

Ejemplo 2
Creacin de una interfaz grfica que muestre el ploteo de las seales trigonomtricas
seno, coseno y la suma de ambas. Para esto se realizar el siguiente GUI:

Se crea un nuevo GUI con el nombre func_trig. Al mismo se coloca un panel, un

componente axes y un pop-up menu. Es necesario editar el string del pop-up men con
seno, coseno y suma. Y colocarle como Tag la palabra sel (de seleccin).
Todo m-file posee un campo donde se puede programar las condiciones iniciales que
tendr
nuestro
diseo.
Por
defecto,
se
etiqueta
<nombre_de_nuestro
diseo>_OpeningFcn. En el ejemplo, est etiquetada como func_trig_OpeningFcn. Debajo
de esta lnea, se coloca el siguiente cdigo:
handles.ejex=0:pi/360:2*pi;
y1=sin(2*pi*1*handles.ejex);
plot(handles.ejex,y1,'LineWidth',2);grid on;
axis([0 2*pi -1 1]);
Para cambiar la forma en que aparece el panel; nada ms se da doble click sobre el
elemento y en sus propiedades escribimos funciones trigonomtricas en el campo ttulo.
En el apartado backgroundcolor se elige el color celeste y se da ok.
Con un click derecho en pop-up men, nos ubicamos en View Callbacks>>Callbacks. Esto
nos lleva a la subrutina function sel_Callback(hObject, eventdata, handles), donde se
editar las siguientes lneas de cdigo:
fun =get(handles.sel,'Value');
switch fun
case 1
y1=sin(2*pi*1*handles.ejex);
plot(handles.ejex,y1,'LineWidth',2);grid on;axis([0 2*pi -1 1]);
case 2
y2=cos(2*pi*1*handles.ejex);
plot(handles.ejex,y2,'LineWidth',2);grid on;axis([0 2*pi -1 1]);
case 3
y3=sin(2*pi*1*handles.ejex)+cos(2*pi*1*handles.ejex);
plot(handles.ejex,y3,'LineWidth',2);grid on;
axis([0 2*pi min(y3) max(y3) ]);
end
guidata(hObject, handles);
Para el pushbotton SALIR en sus propiedades le asignamos como String y como Tag
SALIR y un backgroundcolor rojo. El cdigo es el siguiente:
% --- Executes on button press in SALIR.
function SALIR_Callback(hObject, eventdata, handles)
opc=questdlg('Desea salir del programa?','SALIR','Si','No','No');
if strcmp(opc,'No')
return;
end
clear,clc,close all
% hObject handle to SALIR (see GCBO)
% eventdata reserved - to be defined in a future version of MATLAB
% handles structure with handles and user data (see GUIDATA)

Las instrucciones
trucciones anteriores generan un cuadro de mensaje para el usuario,
usuario de tipo
pregunta. Se pueden ejecutar o no sentencias dependiendo de la respuesta escogida. Por
ejemplo, si deseamos
eseamos salir o no del programa se tiene:
opc=questdlg('Desea
'Desea salir del programa?','SALIR','Si','No','No');
programa?'
if strcmp(opc,'No')
return;
end
clear,clc,close all

(
Clear
La funcin strcmp compara dos strings y si son iguales retorna el valor 1 (true).
elimina todas los valores de workspace, clc limpia la pantalla y close all cierra todos los
Guide. Ntese que la secuencia 'Si','No','No' termina en 'No'; con esto se logra que la
parte No del cuadro de pregunta est resaltado. Si terminara en 'Si', la parte Si del cuadro
de pregunta se resaltara.
Cmo ejecutar todos los GUI?
1. Desde la ventana de comandos (digitando el nombre del programa)
2. Dando click en el siguiente boton del GUIDE

EJERCICIO
Crear un programa (con GUI) que calcule la corriente que pasa por un resistor.
Entradas del usuario: Voltaje en V y Resistencia en ohms. A continuaci
continuacin se muestra la
interfaz final y para cada una de sus partes se muestra
uestra el tipo de control que representa,
representa
seguido de las
as propiedades que usted deber modificar dando doble click en cada una de
esos elementos.

A continuacin se presenta el cdigo con comentarios para poder comprenderlo mejor.

%
%
v
r

Elvalor que el usuario a ingresado en los edit text

se esta asignando a las variables v y r
= eval(get(handles.v_edit,'String'));
eval(get(handles.v_edit,
= eval(get(handles.r_edit,'String'));
eval(get(handles.r_edit,

% Definicin de corriente
i = v/r;
% A la propiedad String de la variable i_text
% se le esta asignando el valor que posee
% la variable i
set(handles.i_text,'String'
'String',i);

Este cdigo ser digita en el callback del push button calcular pues se desea que
cuando este boton sea accionado se realicen los clculos.