Esta página aún no se ha traducido para esta versión. Puede ver la versión más reciente de esta página en inglés.

Crea una aplicación sencilla usando GUIDE

Nota

Este tema se aplica a las aplicaciones que cree mediante GUIDE. Para obtener formas alternativas de compilar aplicaciones, consulte.Formas de crear aplicaciones

En este ejemplo se muestra cómo usar GUIDE para crear una aplicación que tiene una interfaz de usuario simple (IU), como la que se muestra aquí.

Las secciones siguientes le guiarán a través del proceso de creación de esta aplicación.

Si solo desea ver y ejecutar el código que creó esta aplicación, establezca la carpeta actual en una a la que tenga acceso de escritura. Copie el código de ejemplo y ábralo en el editor emitiendo los siguientes comandos: haga clic en elMATLAB®

copyfile(fullfile(docroot, 'techdoc','creating_guis',...    'examples','simple_gui*.*')),fileattrib('simple_gui*.*', '+w'); guide simple_gui.fig; edit simple_gui.m
Run botón para ejecutar la aplicación.

Abra una nueva interfaz de usuario en el editor de diseño GUIDE

  1. Inicie GUIDE escribiendo en el símbolo del sistema.guideMATLAB

  2. En el cuadro de diálogo guía de inicio rápido, seleccione la plantilla y, a continuación, haga clic en.Blank GUI (Default)OK

  3. Visualice los nombres de los componentes en la paleta de componente:

    1. Seleccione File > Preferences > GUIDE.

    2. Seleccione Show names in component palette.

    3. Haga clic.OK

Ajuste el tamaño de la ventana en GUIDE

Establezca el tamaño de la ventana redimensionando el área de cuadrícula en el editor de diseño. Haga clic en la esquina inferior derecha y arrástrelo hasta que el lienzo sea de aproximadamente 3 pulgadas de alto y 4 pulgadas de ancho. Si es necesario, haga que el lienzo sea más grande.

Diseño de la interfaz de usuario

Agregue, alinee y etiquete los componentes en la interfaz de usuario.

  1. Agregue los tres botones Push a la interfaz de usuario. Seleccione la herramienta de pulsador de la paleta de componentes en el lado izquierdo del editor de diseño y arrástrela al área de diseño. Cree tres botones, colocándolos aproximadamente como se muestra en la siguiente figura.

  2. Agregue los componentes restantes a la interfaz de usuario.

    • Un área de texto estático

    • Un menú emergente

    • Los ejes

    Organice los componentes como se muestra en la figura siguiente. Cambie el tamaño del componente de ejes a aproximadamente 2 por 2 pulgadas.

Alinee los componentes

Si varios componentes tienen el mismo elemento principal, puede utilizar la herramienta de alineación para alinearlos entre sí. Para alinear los tres pulsadores:

  1. Seleccione los tres pulsadores pulsando y haciendo clic en ellos.Ctrl

  2. Seleccione Tools > Align Objects.

  3. Realice estos ajustes en la herramienta de alineación:

    • Alineado a la izquierda en la dirección horizontal.

    • 20 píxeles de espaciado entre los pulsadores en la dirección vertical.

  4. Haga clic.OK

Etiquete los pulsadores

Cada uno de los tres pulsadores especifica un tipo de trazado: surf, malla y contorno. En esta sección se muestra cómo etiquetar los botones con esas opciones.

  1. Seleccione View > Property Inspector.

  2. En el área de diseño, haga clic en el botón pulsador superior.

  3. En el inspector de propiedades, seleccione la propiedad y, a continuación, reemplace el valor existente por la palabra.StringSurf

  4. Pulse la tecla.Entrar La etiqueta del pulsador cambia a.Surf

  5. Haga clic en cada uno de los pulsadores restantes a su vez y repita los pasos 3 y 4. Etiquete el pulsador central y el botón inferior.MeshContour

Lista elementos del menú emergente

El menú emergente ofrece una selección de tres conjuntos de datos: picos, membrana y sinc. Estos conjuntos de datos corresponden a funciones del mismo nombre.MATLAB En esta sección se muestra cómo enumerar esos conjuntos de datos como opciones en el menú emergente.

  1. En el área de diseño, haga clic en el menú emergente.

  2. En el inspector de propiedades, haga clic en el botón situado junto a.String Aparece el cuadro de diálogo cadena.

  3. Reemplace el texto existente con los nombres de los tres conjuntos de datos: picos, membrana y sinc. Pulse para desplazarse a la siguiente línea.Entrar

  4. Cuando termine de editar los elementos, haga clic en.OK

    El primer elemento de la lista aparece en el menú emergente del área de diseño.peaks

Modifique el texto estático

En esta interfaz de usuario, el texto estático sirve como etiqueta para el menú emergente. En esta sección se muestra cómo cambiar el texto estático que se leerá.Select Data

  1. En el área de diseño, haga clic en el texto estático.

  2. En el inspector de propiedades, haga clic en el botón situado junto a.String En el cuadro de diálogo cadena que aparece, reemplace el texto existente por la frase.Select Data

  3. Haga clic.OK

    La frase aparece en el componente de texto estático situado encima del menú emergente.Select Data

Guarde el diseño

Cuando se guarda un diseño, GUIDE crea dos archivos, un archivo FIG y un archivo de código. El FIG-File, con extensión, es un archivo binario que contiene una descripción del diseño..fig El archivo de código, con extensión, contiene funciones que controlan el comportamiento de la aplicación..mMATLAB

  1. Guarde y ejecute el programa seleccionando Tools > Run.

  2. GUIDE muestra un cuadro de diálogo que muestra: "La activación guardará los cambios en el archivo y el código de la figura.MATLAB ¿Desea continuar?

    Haga clic.Yes

  3. GUIDE abre un cuadro de diálogo en la carpeta actual y le solicita un nombre de archivo FIG.Save As

  4. Vaya a cualquier carpeta para la que tenga privilegios de escritura y, a continuación, escriba el nombre del archivo FIG-File.simple_gui GUIDE guarda el archivo FIG y el archivo de código con este nombre.

  5. Si la carpeta en la que guarda los archivos no está en la ruta de acceso, GUIDE abre un cuadro de diálogo que le permite cambiar la carpeta actual.MATLAB

  6. GUIDE guarda los archivos y, a continuación, ejecuta el programa.simple_gui.figsimple_gui.m También abre el archivo de código en el editor predeterminado.

    La aplicación se abre en una nueva ventana. Tenga en cuenta que la ventana carece de la barra de menús estándar y barra de herramientas que figura ventanas Mostrar.MATLAB Puede agregar sus propios menús y botones de la barra de herramientas con GUIDE, pero de forma predeterminada una aplicación GUIDE incluye ninguno de estos componentes.

    Cuando se ejecuta, puede seleccionar un conjunto de datos en el menú emergente y hacer clic en los botones de inserción, pero no sucede nada.simple_gui Esto se debe a que el archivo de código no contiene instrucciones para el servicio del menú emergente y los botones.

Para ejecutar una aplicación creada con GUIDE sin abrir GUIDE, ejecute su archivo de código escribiendo su nombre.También puede utilizar el comando con el archivo de código, por ejemplo,

 simple_gui
run
run simple_gui

Nota

No intentes ejecutar tu aplicación abriendo su archivo FIG fuera de GUIDE. Si lo hace, la figura se abre y aparece lista para usar, pero la interfaz de usuario no se inicializa y las devoluciones de llamada no funcionan.

Codificar el comportamiento de la aplicación

Cuando guardó el diseño en la sección anterior, GUIDE creó dos archivos: un archivo FIG, y un archivo de programa,.Guarde el diseñosimple_gui.figsimple_gui.m Sin embargo, la aplicación no responde porque no contiene ninguna instrucción que realice acciones.simple_gui.m En esta sección se muestra cómo agregar código al archivo para que la aplicación sea funcional.

Generar datos para trazar

En esta sección se muestra cómo generar los datos que se trazarán cuando el usuario haga clic en un botón. El genera estos datos mediante la llamada a funciones.opening functionMATLAB La función de apertura inicializa la interfaz de usuario cuando se abre, y es la primera devolución de llamada en cada archivo de código generado por la guía.

En este ejemplo, agregará código que crea tres conjuntos de datos a la función de apertura. El código usa las funciones y.MATLABpeaksmembranesinc

  1. Visualice la función de apertura en el editor.MATLAB

    Si el archivo aún no está abierto en el editor, ábralo desde el editor de diseño seleccionandosimple_gui.m View > Editor.

  2. En la pestaña, en la sección, haga clic en y, a continuación, seleccioneEDITORNAVIGATEGo To simple_gui_OpeningFcn.

    El cursor se desplaza a la función de apertura, que contiene este código:

    % --- Executes just before simple_gis made visible. function simple_gui_OpeningFcn(hObject, eventdata, handles, varargin) % This function has no output args, see OutputFcn. % hObject    handle to figure % eventdata  reserved - to be defined in a future version of MATLAB % handles    structure with handles and user data (see GUIDATA) % varargin   command line arguments to simple_g(see VARARGIN)  % Choose default command line output for simple_gui handles.output = hObject;   % Update handles structure guidata(hObject, handles);   % UIWAIT makes simple_gwait for user response (see UIRESUME) % uiwait(handles.figure1);
  3. Cree datos para trazar agregando el siguiente código a la función de apertura inmediatamente después del comentario que comienza% varargin...

    % Create the data to plot. handles.peaks=peaks(35); handles.membrane=membrane; [x,y] = meshgrid(-8:.5:8); r = sqrt(x.^2+y.^2) + eps; sinc = sin(r)./r; handles.sinc = sinc; % Set the current data value. handles.current_data = handles.peaks; surf(handles.current_data)

    Las primeras seis líneas ejecutables crean los datos mediante las funciones y.MATLABpeaksmembranesinc Almacenan los datos en la estructura, un argumento proporcionado a todas las devoluciones de llamada.handles Las devoluciones de llamada para los botones Push pueden recuperar los datos de la estructura.handles

    Las dos últimas líneas crean un valor de datos actual y lo establecen en picos y, a continuación, muestran la gráfica de surf para los picos. En la siguiente ilustración se muestra cómo se ve la aplicación cuando se muestra por primera vez.

Comportamiento del menú emergente de código

El menú emergente presenta opciones para trazar los datos. Cuando el usuario selecciona una de las tres parcelas, el software establece la propiedad del menú emergente en el índice del elemento de menú seleccionado.MATLABValue La devolución de llamada del menú emergente lee la propiedad del menú emergente para determinar el elemento que el menú muestra actualmente y se establece en consecuencia.Valuehandles.current_data

  1. Muestre la devolución de llamada del menú emergente en el editor.MATLAB En el editor de diseño de GUIDE, haga clic con el botón derecho en el componente de menú emergente y, a continuación, seleccione View Callbacks > Callback.

    GUIDE muestra el archivo de código en el editor y mueve el cursor a la devolución de llamada del menú emergente, que contiene este código:

    % --- Executes on selection change in popupmenu1. function popupmenu1_Callback(hObject, eventdata, handles) % hObject    handle to popupmenu1 (see GCBO) % eventdata  reserved - to be defined in a future version of MATLAB % handles    structure with handles and user data (see GUIDATA)
  2. Agregue el siguiente código a la después del comentario que comienzapopupmenu1_Callback% handles...

    Este código recupera primero dos propiedades del menú emergente:

    • — una matriz de celdas que contiene el contenido del menúString

    • : el índice en el contenido del menú del conjunto de datos seleccionadoValue

    El código, a continuación, utiliza una instrucción para hacer que los datos seleccionados establecen los datos actuales.switch La última instrucción guarda los cambios en la estructura.handles

    % Determine the selected data set. str = get(hObject, 'String'); val = get(hObject,'Value'); % Set current data to the selected data set. switch str{val}; case 'peaks' % User selects peaks.    handles.current_data = handles.peaks; case 'membrane' % User selects membrane.    handles.current_data = handles.membrane; case 'sinc' % User selects sinc.    handles.current_data = handles.sinc; end % Save the handles structure. guidata(hObject,handles)

Comportamiento de pulsador de código

Cada uno de los pulsadores crea un tipo de trazado diferente utilizando los datos especificados por la selección actual en el menú emergente. Las devoluciones de llamada del botón pulsador obtienen datos de la estructura y, a continuación, los trazan.handles

  1. Visualice la devolución de llamada del pulsador en el editor.SurfMATLAB En el editor de diseño, haga clic con el botón derecho en el pulsador y, a continuación, seleccioneSurf View Callbacks > Callback.

    En el editor, el cursor se desplaza a la devolución de llamada del botón de inserción en el archivo de código, que contiene este código:Surf

    % --- 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)
  2. Agregue el código siguiente a la devolución de llamada inmediatamente después del comentario que comienza% handles...

    % Display surf plot of the currently selected data. surf(handles.current_data);
  3. Repita los pasos 1 y 2 para agregar código similar a las devoluciones de llamada de botón y Push.MeshContour

    • Agregue este código a la devolución de llamada del botón pulsador:Meshpushbutton2_Callback

        % Display mesh plot of the currently selected data.   mesh(handles.current_data);
    • Agregue este código a la devolución de llamada del botón pulsador:Contourpushbutton3_Callback

        % Display contour plot of the currently selected data.   contour(handles.current_data);
  4. Guarde el código seleccionando File > Save.

Ejecute la aplicación

En, programó el menú emergente y los pulsadores.Codificar el comportamiento de la aplicación También ha creado datos para que los utilicen e inicialicen la visualización. Ahora puede ejecutar su programa para ver cómo funciona.

  1. Ejecute el programa desde el editor de diseño seleccionando Tools > Run.

  2. En el menú emergente, seleccione y, a continuación, haga clic en el botón.MembraneMesh La aplicación muestra una gráfica de malla de la Logotipo de membrana en forma de LMathWorks®.

  3. Pruebe otras combinaciones antes de cerrar la ventana.

Temas relacionados