Top Banner
Creación de una Interfaz Gráfica del Usuario(GUI) Versión 7 Marzo 2006 Autor: Arturo Salinas C.
25

CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Jun 13, 2015

Download

Technology

Arturo Salinas
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Creación de una Interfaz Gráfica del Usuario(GUI)

Versión 7

Marzo 2006

Autor: Arturo Salinas C.

Page 2: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Para crear una interfaz gráfica proceda a seleccionar en MATLAB: FILE, NEW GUI

Page 3: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Aparece la siguiente ventana:

Haga clic sobre el botón OK con el botón izquierdo del ratón

Page 4: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Aparece la siguiente ventana:

Page 5: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Si los controles de la izquierda de la ventana anterior no tienen visibles sus nombres, proceda a seleccionar de la barra menú la opción FILE, PREFERENCES y obtendrá la ventana:

Page 6: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Active la casilla de verificación SHOW NAMES IN COMPONENTS PALETTE como se aprecia en la siguiente ventana:

Page 7: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

La ventana quedará como se aprecia a continuación:

Page 8: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Proceda a guardar este GUI yendo a FILE, SAVE AS dando nombre EJEMPLO1 y pulsar botón del ratón sobre el botón GUARDAR como se aprecia a continuación.

Page 9: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Ahora bien, procederemos a insertar tres BOTONES DE COMANDO(PUSH BUTTOM). Para ello haga clic sobre el botón PUSH BUTTOM y arrastre hacia el área de gráficos como se aprecia en la ventana siguiente:

Page 10: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Ubique cursor del ratón sobre el botón recién creado y pulse el botón derecho del ratón y obtendrá el menú contextual siguiente:

Page 11: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Elija la opción DUPLICATE y le creará una copia de ese botón. Repita la acción y tendrá la siguiente ventana:

Page 12: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Arrastre los botones de modo que queden como se ve en la siguiente ventana:

Page 13: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Ubíquese sobre el primer botón y pulse botón izquierdo del ratón y le aparecerá una ventana cuyo título es PROPERTY INSPECTOR vaya a la propiedad STRING y ponga el texto Grafico 1 como se observa en la siguiente ventana:

Page 14: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Ahora cierre el cuadro de diálogo PROPERTY INSPECTOR y realice la misma acción anterior sobre el segundo botón de comando y en la propiedad STRING digite Grafico 2 como se aprecia a continuación:

Page 15: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Ahora cierre el cuadro de diálogo PROPERTY INSPECTOR y realice la misma acción anterior sobre el tercer botón de comando y en la propiedad STRING digite Grafico 3 como se aprecia a continuación:

Page 16: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

A continuación, procederemos a guardar el GUI nuevamente y nos aparecerá la siguiente ventana.

Ubique la función pushbuttom1_Callback que se encuentra casi al final del archivo

Page 17: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Inserte las siguientes instrucciones en esa función y en la posición que se indica en la siguiente ventana:

Page 18: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Haga lo mismo con la función pushbuttom2_Callback y agregue las instrucciones que se indican a continuación:

Page 19: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Finalmente proceda a agregar las siguientes instrucciones en la función pushbuttom3_Callback

Page 20: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Con lo anterior tenemos nuestro GUI completo por lo tanto lo guardaremos:

Después salimos desde ese GUI

Page 21: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Probaremos el GUI recién terminado para lo cual desde la ventana de comandos de MATLAB digite ejemplo1 y aparecerá la siguiente pantalla:

Page 22: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Damos un clic sobre el botón con nombre Grafico 1 y vemos la siguiente pantalla:

Page 23: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Bueno, ahora hacemos un clic sobre el botón con nombre Grafico 2 y vemos la siguiente pantalla:

Page 24: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Bueno, ahora hacemos un clic sobre el botón con nombre Grafico 3 y vemos la siguiente pantalla:

Page 25: CreacióN De Una Interfaz GráFica Del Usuario(Gui)

Si obtenemos los resultados anteriores, significa que nuestro GUI está perfecto por lo que lo podremos utilizar en el futuro o modificarlo para agregarle otros objetos.

Hemos logrado confeccionar rápidamente una demostración bastante simple pero que nos ilustra la facilidad de esta herramienta para producir material de apoyo.