Generate, Modify and Deploy a MATLAB App for a Simulink Model
simulink.compiler.genapp enables you to automatically generate a
MATLAB® app for a Simulink® model. You can compile and deploy the automatically generated app using the
mcc command. The following example generates an app for a model, compiles
and deploys it, and explores how you can customize the app using the MATLAB App Designer.
Generate and Deploy a MATLAB App for a Model
This example shows you how to use the
simulink.compiler.genapp function to generate a MATLAB app for a model, that is deployable. Typically when a Simulink model is functionally complete, it is often used to run multiple simulations different input and parameter values. To try simulations for your model with different input and parameter values, you can generate a MATLAB App. You can also deploy this generated app for use outside of MATLAB.
This example illustrates the use of
simulink.compiler.genapp function to generate a starter app for the model
f14, using the generated app to tune the parameters of the model and simulate it, and customizing the app in the MATLAB App Designer.
Open the Model
simulink.compiler.example.AppGeneration command loads the example project on your path. This project contains all the files required for this example including the model. Open the model
Generate a MATLAB App for the Model
simulink.compiler.genapp function to generate an app for the
f14 model. Running the
simulink.compiler.genapp function with the model name as an argument generates an App named
f14app. Simulink Compiler uses a default template to generate the app. The generated app provides an ability to tune the parameters and simulate the model for which the app is generated. The generated app also provides the plot of the simulation results. All the files are generated into the
simulink.compiler.genapp('f14', 'AppName', 'f14app');
After generating the app, Click Simulate to simulate the app.
Along with the app, the following artifacts are generated :
f14app.mlappfile -- This file contains the code for the generated app. Open this file in App Designer for editing.
Files starting with the
defaultprefix -- Functions returning default values used by the app such as, model name, model image aspect ratio, model image file, and input MAT-file name.
Model Image, (
f14app_image.svg) -- Image of the Simulink Model.
Inputs used in the simulation (
MATfile containing all the inputs that are used in the simulation of the model.
App labels file
setLabels.m-- File specifying label contents.
Default Simulink logo (
SimulinkLogo.png) -- File used as a placeholder for the model image.
pragma.mdirectives file -- File used by Simulink Compiler to generate the deployable app.
Set of MATLAB functions as M-files -- Files that the app uses to control user interface of the app.
Compile and Deploy the Generated App
You can use the MATLAB App Designer to compile and deploy the app. You can also use
deploytool. For more information on compiling and deploying with App Designer, see Develop Apps Using App Designer, Web Apps and Application Compiler.
In this example, we compile the app, with the
mcc command followed by the app name.
mcc -m f14App
Customize the Generated App
You can also customize the generated app. To customize the app, use the App designer. The generated app
f14 is generic, but it allows you to eailiy customize it in the App Designer. In this section, we are going to replace the one axis in the generated app with two axes. Open the generated app in the app designer.
The idea of customization is to replace the Axes component with two Axes components. To get two Axes components, use a grid with two rows and one column and placing the two components in the grid cells (the customized app,
f14customapp is included as a part of this example project file for your reference). You can follow:
In Design View, select and delete the default Axes component.
Go to Component Library on the left side of the window. From the Component Library, drag and drop a Grid Layout component under the Containers section in place of the removed Axes component. In Component Browser on the right, on the Inspection tab under the Grid Layout, update
'1x,1x', respectively. This updates the grid to have two vertical cells. Drag two Axes components from the Common section in Component Library and place them in the two grid cells.
The external input references to
UIAxes(the original Axes component) have to be updated to
UIAxes2. If you added the top Axes first,
External Inputs. You can check by switching to Design View and verifying which Axes gets the focus when the component is selected in Component Browser.
Now find and replace these occurrences in the Code View. Using the
Find & Replacedialog, replace UIAxes with UIAxes2 or additions. Once you complete the replacements, add the following line code to the
cbkSimulate(app, event)function. After the line for
Save the app
Use the Modified App to Simulate the Model
Now that you have modified the app to show two axes, you can use that app to simulate the model. You can then compile and deploy the app. To simulate the app, click Load Input MAT-file and choose the
externalInputs.mat file to attach an external input signal to Inport 1 of the
f14 model. This activates the
External Input drop down and displays the loaded signal,
Signal.RandomStickPosition in the list box under the drop down. Select the loaded signal to display in the bottom Axes component. Click Simulate. After the simulation completes, the two Axes components update. You can observe the effect of the loaded input signal on the logged signals in the top Axes.