Main Content

La traducción de esta página aún no se ha actualizado a la versión más reciente. Haga clic aquí para ver la última versión en inglés.

Crear apps multiventana en App Designer

Una app multiventana consiste en dos o más apps que comparten datos. La forma de compartir datos entre las apps depende del diseño. Un diseño común incluye dos apps: una app principal y un cuadro de diálogo. Habitualmente, la app principal tiene un botón que abre el cuadro de diálogo. Cuando el usuario cierra el cuadro de diálogo, envía las selecciones del usuario a la ventana principal, que realiza cálculos y actualiza la interfaz de usuario.

A main app window and a dialog box window with a double-sided arrow between the two

Estas apps comparten información de formas distintas en diferentes momentos:

  • Cuando el cuadro de diálogo se abre, la app principal pasa información al cuadro de diálogo llamando a la app de cuadro de diálogo con argumentos de entrada.

  • Cuando el usuario hace clic en el botón OK de la app de cuadro de diálogo, este devuelve información a la app principal llamando a una función pública de la app principal con argumentos de entrada.

Visión general del proceso

Para crear la app descrita en la sección anterior, debe crear dos apps separadas (una app principal y una app de cuadro de diálogo). Después, realice estas tareas de alto nivel. Cada tarea incluye varios pasos.

  • Enviar información al cuadro de diálogo: escriba un callback StartupFcn en la app de cuadro de diálogo que acepte argumentos de entrada. Uno de los argumentos de entrada debe ser el objeto de la app principal. Después, en la app principal, llame a la app de cuadro de diálogo con los argumentos de entrada.

  • Devolver información a la app principal: escriba una función pública en la app principal que actualice la interfaz de usuario en función de las selecciones del usuario en el cuadro de diálogo. Dado que es una función pública, la app de cuadro de diálogo puede llamarla y pasarle valores.

  • Administrar ventanas cuando se cierran: escriba en ambas apps callbacks CloseRequest que realicen tareas de mantenimiento cuando las ventanas se cierren.

Para ver la implementación de todos los pasos de este proceso, consulte App gráfica que abre un cuadro de diálogo.

Si prevé desplegar la app como app web (requiere MATLAB® Compiler™), no se admite crear varias ventanas de app. En su lugar, considere crear una app de una sola ventana con varias pestañas. Para obtener más información, consulte Web App Limitations and Unsupported Functionality (MATLAB Compiler).

Enviar información al cuadro de diálogo

Lleve a cabo estos pasos para pasar valores de la app principal al cuadro de diálogo.

  1. En la app de cuadro de diálogo, defina argumentos de entrada para la función callback StartupFcn. En Code View, en la pestaña Editor, haga clic en App Input Arguments . En el cuadro de diálogo de detalles de la app, introduzca una lista de nombres de variables separados por comas para sus argumentos de entrada. Designe estas entradas:

    • App principal: pasa el objeto de la app principal a la app de cuadro de diálogo para que pueda hacer referencia a las funciones y propiedades de la app principal desde dentro del código de la app de cuadro de diálogo.

    • Datos adicionales: pasa cualquier dato adicional definido en la app principal al que la app de cuadro de diálogo necesite acceder.

    Haga clic en OK.

    App Input Arguments dialog box. An edit field for specifying input arguments to the startupFcn callback contains the variable names "caller", "sz", and "c".

  2. En la app de cuadro de diálogo, añada código para almacenar el objeto de la app principal.

    1. Primero, defina una propiedad para almacenar la app principal. En Code View, en la pestaña Editor, seleccione Property > Private Property. Después, cambie el nombre de la propiedad en el bloque properties a CallingApp.

      properties (Access = private)
          CallingApp % Main app
      end

    2. Después, en la función callback StartupFcn, añada código para almacenar el objeto de la app principal en la propiedad CallingApp.

      function StartupFcn(app,caller,sz,c)
          % Store main app object
          app.CallingApp = caller;
      
          % Process sz and c inputs
          % ...
      end

      Para ver un ejemplo completamente codificado de un callback StartupFcn, consulte App gráfica que abre un cuadro de diálogo.

  3. En la app principal, llame a la app de cuadro de diálogo desde dentro de un callback para crear el cuadro de diálogo.

    1. Primero, defina una propiedad para almacenar la app de cuadro de diálogo. En la app principal, en Code View, en la pestaña Editor, seleccione Property > Private Property. Después, cambie el nombre de la propiedad en el bloque properties a DialogApp.

      properties (Access = private)
          DialogApp % Dialog box app
      end

    2. Después, añada una función callback para el botón Options. Este callback desactiva el botón Options para evitar que los usuarios abran varios cuadros de diálogo. Después, obtiene los valores para pasar al cuadro de diálogo y, a continuación, llama a la app de cuadro de diálogo con argumentos de entrada y un argumento de salida. El argumento de salida es el objeto de la app de cuadro de diálogo.

      function OptionsButtonPushed(app,event) 
          % Disable Plot Options button while dialog is open
          app.OptionsButton.Enable = "off";
      
          % Get sample size and colormap
          % ...
          
          % Call dialog box with input values
          app.DialogApp = DialogAppExample(app,szvalue,cvalue);
      end

      Para ver un ejemplo completamente codificado de un callback, consulte App gráfica que abre un cuadro de diálogo.

Devolver información a la app principal

Lleve a cabo estos pasos para devolver las selecciones del usuario desde la app de cuadro de diálogo a la app principal.

  1. En la app principal, cree una función pública que actualice la interfaz de usuario. Con la app principal abierta en Code View, en la pestaña Editor, seleccione Function > Public Function.

    Cambie el nombre predeterminado de la función al nombre deseado y añada argumentos de entrada para cada opción que desea pasar desde el cuadro de diálogo a la app principal. El argumento app, que representa el objeto de la app principal, debe ser el primero, así que especifique los argumentos adicionales después de ese argumento. Después, añada código a la función para procesar las entradas y actualizar la app principal.

    function updateplot(app,sz,c) 
        % Process sz and c 
        ...
    end

    Para ver un ejemplo completamente codificado de una función pública, consulte App gráfica que abre un cuadro de diálogo.

  2. En la app de cuadro de diálogo, llame a la función pública desde dentro de un callback. Con la app de cuadro de diálogo abierta en Code View, añada una función callback para el botón OK.

    En este callback, llame a la función pública definida en el código de la app principal. Pase el objeto de la app principal, almacenado en la propiedad CallingApp, como el primer argumento. Después, pase los datos adicionales que la app principal necesita para actualizar su interfaz de usuario. Por último, llame a la función delete para cerrar el cuadro de diálogo.

    function ButtonPushed(app,event)
       % Call main app's public function
       updateplot(app.CallingApp,app.EditField.Value,app.DropDown.Value);
    
       % Delete the dialog box  
       delete(app)                  
    end

Administrar ventanas cuando se cierran

Ambas apps deben realizar determinadas tareas cuando el usuario las cierra. Antes de que el cuadro de diálogo se cierre, debe volver a activar el botón Options en la app principal. Antes de que la app principal se cierre, debe asegurarse de que el cuadro de diálogo esté cerrado.

  1. Con la app de cuadro de diálogo abierta en Code View, haga clic con el botón secundario en el objeto app.UIFigure del Component Browser y seleccione Callbacks > Add CloseRequestFcn callback. Después, añada código que vuelva a activar el botón de la app principal y cierre la app de cuadro de diálogo.

    function DialogAppCloseRequest(app,event)
       % Enable the Plot Options button in main app
       app.CallingApp.OptionsButton.Enable = "on";
                
       % Delete the dialog box 
       delete(app)             
    end

  2. Con la app principal abierta en Code View, haga clic con el botón secundario en el objeto app.UIFigure del Component Browser y seleccione Callbacks > Add CloseRequestFcn callback. Después, añada código que cierre ambas apps.

    function MainAppCloseRequest(app,event)
       % Delete both apps
       delete(app.DialogApp)
       delete(app)              
    end

Ejemplo: App gráfica que abre un cuadro de diálogo

Esta app consiste en una app gráfica principal que tiene un botón para seleccionar opciones de un cuadro de diálogo. El botón Options llama a la app de cuadro de diálogo con argumentos de entrada. En el cuadro de diálogo, el callback para el botón OK devuelve las selecciones del usuario a la app principal llamando a una función pública en la app principal.

Temas relacionados