INTERFACES GRAFICAS CON MATLAB

INSTRUCTORES:

SAAVEDRAMARTINEZ J. EMANUEL; M. EN I.
josaavedra@itesi.edu.mx
SOSA TORRES MIGUEL ANGEL; M. EN I.
misosa@itesi.edu.mx
JUAREZ CASTRO ALBERTO; M. EN F.
aljuarez@itesi.edu.mx

Enero 2014
1

Coordinacin Ing. Electrnica

INTERFACES GRAFICAS CON MATLAB

DISTRIBUCION CURSO
MIERCOLES
JUEVES
VIERNES

PARTE I. INTRODUCCION A COMANDOS

PARTE II. APLICACIONES
PARTE III. APLICACIONES GRAFICAS

3 Hrs
3 Hrs
4 Hrs

PARTE I. INTRODUCCION A COMANDOS

CONTENIDO
1. OBJETIVO
1.1. COMPETENCIAS GENERICAS
1.2. COMPETENCIAS ESPECIFICAS
2. INTRODUCCION
3. INICIO
4. PROPIEDADES DE LOS COMPONENTES
5. FUNCIONAMIENTO DE UNA APLICACIN GUI
6. SENTENCIAS get Y set
7. EJERCICIOS PARTE I

1. OBJETIVO
El presente curso tiene como objetivos desarrollar las competencias genricas y
especficas siguientes:
1.1. COMPETENCIAS GENERICAS
Competencias instrumentales

Capacidad de anlisis y sntesis

Capacidad de organizar y planificar
Habilidades bsicas de programacin
Solucin de problemas

Coordinacin Ing. Electrnica

Competencias interpersonales

Trabajo en equipo
Habilidades interpersonales

Competencias sistmicas

Capacidad de aplicar los conocimientos en la prctica

Habilidad para trabajar en forma autnoma

1.2. COMPETENCIAS ESPECIFICAS

Conocer y aplicar los conceptos de programacin de MATLAB en el entorno de

interfaces graficas (GUI) como una herramienta en el apoyo de problemas de
ingeniera e investigacin.

2. INTRODUCCION.
GUI es el acrnimo de Graphycals User Interface y es un entorno de programacin visual
disponible en MATLAB para realizar y ejecutar programas que necesiten ingreso continuo
de datos. Tiene las caractersticas bsicas de todos los programas visuales como Visual
Basic o Visual C++.
3. INICIO
Para iniciar nuestro proyecto, lo podemos hacer de dos maneras:
a) Ejecutando la siguiente instruccin en la ventana de comandos:
>> guide
b) Haciendo un click en el cono que muestra la figura:

Coordinacin Ing. Electrnica

Se presenta el siguiente cuadro de dilogo:

Se presentan las siguientes opciones:

a) Blank GUI (Default)
La opcin de interfaz grfica de usuario en blanco (viene predeterminada), nos presenta un
formulario nuevo, en el cual podemos disear nuestro programa.
b) GUI with Uicontrols
Esta opcin presenta un ejemplo en el cual se calcula la masa, dada la densidad y el
volumen, en alguno de los dos sistemas de unidades. Podemos ejecutar este ejemplo y
obtener resultados.
c) GUI with Axes and Menu
Esta opcin es otro ejemplo el cual contiene el men File con las opciones Open, Print y
Close. En el formulario tiene un Popup menu, un push button y un objeto Axes, podemos
ejecutar el programa eligiendo alguna de las seis opciones que se encuentran en el men
despegable y haciendo click en el botn de comando.
d) Modal Question Dialog
4

Coordinacin Ing. Electrnica

Con esta opcin se muestra en la pantalla un cuadro de dilogo comn, el cual

consta de una pequea imagen, una etiqueta y dos botones Yes y No,
dependiendo del botn que se presione, el GUI retorna el texto seleccionado (la cadena de
caracteres Yes o No).

Elegimos la opcin a) Blank GUI (Default) para iniciar un proyecto. Al efectuarlo, aparece
la ventana siguiente:

Para obtener la etiqueta de cada elemento de la paleta de componentes ejecutamos:

File>>Preferentes y seleccionamos Show names in component palette. Entonces se
desplega la ventana siguiente:

Coordinacin Ing. Electrnica

Seleccionamos el recuadro con la leyenda Show names in component palette y en los

componentes se muestran sus nombres.

La siguiente tabla muestra una descripcin de los componentes:

Coordinacin Ing. Electrnica

La barra de herramienta principal cuenta con las siguientes funciones:

4. PROPIEDADES DE LOS COMPONENTES

Una vez que se comienza a trabajar en la elaboracin de una GUI, bastar con seleccionar
el control que requiera, y arrastrarlo haca el rea de diseo. Cada uno de los componentes
de la paleta, cuenta adems con un conjunto de opciones; las cuales se pueden accesar
dando click al botn derecho del mouse. Se desplega una serie de opciones
7

Coordinacin Ing. Electrnica

Dos de las opciones que ms se emplean en la elaboracin de la GUI, son:

A) Property Inspector
B) View Callbacks
A continuacin se describen stas y sus principales caractersticas.
A) Property Inspector

Para poder personalizar cada uno de stos controles, seleccionamos Property Inspector.
Seleccionamos esta y se desplega la ventana siguiente:

Coordinacin Ing. Electrnica

Otro ordenamiento sobre las opciones que se tienen en el Inspector Uicontrol,

puede verse al seleccionar el icono
las mismas opciones de trabajo.

Group Properties. Cuya venta muestra

Base Properties. En esta opcin, se encuentran las propiedades del control relacionadas
con identificadores del control dentro del programa. Es decir, se define el nombre de la
variable con la cual se identifica. Esto se puede revisar en Tag, y una vez etiquetado, este
ser el nombre en el programa.
Control. Esta propiedad contiene el activar o desactivar para todo el programa a este
bloque de control. Se recomienda no modificar ninguna opcin.
Data. Contiene la manera en que se va a exhibir este bloque. Es decir, como se etiquetar;
sin embargo, no afecta en la programacin. Esto se realiza en la opcin de String.
Position. Es una manera ms de re-ubicar en el rea de trabajo (y desde luego, como se
ver en la GUI) el control.
Style/Appearance. Contiene lo referente al estilo y color de letras que se desee emplear
para resaltar el control. Esta operacin se ve reflejada en el control, inclusive sin correr el
programa. Se emplean las opciones BackgroundColor para colorear la base del control y
ForegroundColor para dar color a la letra. Tampoco modifique la propiedad Style, pues esta
cambia el control.
NOTAS:
i)

ii)

Recuerde que variando el tag en las propiedades, debe hacer el renombramiento

en el cuerpo del programa. A deferencia del string, el cual es para presentar el
control.
Group Properties y list properties contienen el mismo nmero de propiedades
del control.
9

Coordinacin Ing. Electrnica

B) View Callbacks
Esta opcin contiene entre sus aplicaciones, el llamado callbacks. Al ejecutar esta, abre el
archivo .m asociado al diseo y posiciona en la parte del programa que corresponde a la
subrutina que se ejecutar cuando se realice una determinada accin sobre el elemento que
estamos editando.
5. FUNCIONAMIENTO DE UNA APLICACIN GUI
Una aplicacin GUIDE consta de dos archivos: .m y .fig. El archivo .m es el que contiene el
cdigo con las correspondencias de los botones de control de la interfaz y el archivo .fig
contiene los elementos grficos.
Cada vez que se adicione un nuevo elemento en la interfaz grfica, se genera
automticamente un cdigo en el archivo .m.
Para ejecutar una Interfaz Grfica, con el nombre nombre_del_archivo.fig, se puede realizar
por las siguientes formas: a) en la ventana de comandos >> nombre_del_archivo; b)
haciendo click derecho en el m-file y seleccionando la opcin RUN y c) desde la ventana de
trabajo, dando click al icono

Run.

6. SENTENCIAS get Y set

La asignacin u obtencin de valores de los componentes se realiza mediante las sentencias

get y set. Por ejemplo si se requiere que la variable x1 tenga el valor del control slider:
x1= get(handles.slider1,'Value');

donde se ha de hacer notar, que handles es un identificador de los datos de la aplicacin.

Para asignar el valor a la variable x1 a un control tipo statictext etiquetada como text1 se
escribe:
set(handles.text1,'String',x1);%Escribe el valor del slider en statictext

7. EJERCICIOS PARTE I.

BIBLIOGRAFIA.

10

Coordinacin Ing. Electrnica