This is machine translation

Translated by Microsoft
Mouseover text to see original. Click the button below to return to the English version of the page.

Note: This page has been translated by MathWorks. Click here to see
To view all translated materials including this page, select Country from the country navigator on the bottom of this page.

Designing Apps in App Designer

Lay out and configure the look and feel of an app

Design the look and feel of your app by adding and arranging UI components, and by configuring aspects such as size, color, and initial values.

Functions

expand all

appdesignerOpen App Designer Start Page or existing app file

Common Components

uiaxesCreate UI axes for plots in App Designer
uibuttonCreate push button or state button component
uibuttongroupCreate button group to manage radio buttons and toggle buttons
uicheckboxCreate check box component
uidatepickerCreate date picker component
uidropdownCreate drop-down component
uieditfieldCreate text or numeric edit field component
uiimageCreate image component
uilabelCreate label component
uilistboxCreate list box component
uimenuCreate menu or menu items
uiradiobuttonCreate radio button component
uisliderCreate slider component
uispinnerCreate spinner component
uitable Create table user interface component
uitextareaCreate text area component
uitogglebuttonCreate toggle button component
uitreeCreate tree component
uitreenodeCreate tree node component

Container Components

uifigureCreate figure for designing apps in App Designer
uipanelCreate panel container object
uitabgroupCreate container for tabbed panels
uitabCreate tabbed panel
uigridlayoutCreate grid layout manager

Instrumentation Components

uigaugeCreate gauge component
uiknobCreate knob component
uilampCreate lamp component
uiswitchCreate slider switch, rocker switch, or toggle switch component
expandExpand tree node
collapseCollapse tree node
moveMove tree node
scrollScroll to location within container, list box, or tree
uialertDisplay alert dialog box
uiconfirmCreate confirmation dialog box
uiprogressdlgCreate progress dialog box
uisetcolorOpen color picker
uigetfileOpen file selection dialog box
uiputfileOpen dialog box for saving files
uigetdirOpen folder selection dialog box
uiopenOpen file selection dialog box and load selected file into workspace
uisaveOpen dialog box for saving variables to MAT-file

Properties

expand all

Common Components

UIAxes PropertiesUI axes appearance and behavior
Button PropertiesControl button appearance and behavior
ButtonGroup PropertiesControl button group appearance and behavior
CheckBox PropertiesControl check box appearance and behavior
DatePicker PropertiesControl appearance and behavior of date picker
DropDown PropertiesControl drop-down list appearance and behavior
EditField PropertiesControl edit field appearance and behavior
Image PropertiesControl image component appearance and behavior
Label PropertiesControl label appearance
ListBox PropertiesControl list box appearance and behavior
Menu PropertiesControl appearance and behavior of menu
NumericEditField PropertiesControl numeric edit field appearance and behavior
ProgressDialog PropertiesControl appearance and behavior of progress dialog box
RadioButton PropertiesControl radio button appearance
Slider PropertiesControl slider appearance and behavior
Spinner PropertiesControl spinner appearance and behavior
StateButton PropertiesControl state button appearance and behavior
Table PropertiesControl appearance and behavior of table UI component
TextArea PropertiesControl text area appearance and behavior
ToggleButton PropertiesControl toggle button appearance
Tree PropertiesControl appearance and behavior of tree
TreeNode PropertiesControl appearance and behavior of tree node

Container Components

UI Figure PropertiesControl UI figure appearance and behavior in App Designer
Panel PropertiesControl panel appearance
TabGroup PropertiesControl tab group appearance and behavior
Tab PropertiesControl tab appearance
GridLayout PropertiesControl behavior of grid layout manager

Instrumentation Components

DiscreteKnob PropertiesControl discrete knob appearance and behavior
Gauge PropertiesControl gauge appearance and behavior
Knob PropertiesControl knob appearance and behavior
Lamp PropertiesControl lamp appearance
LinearGauge PropertiesControl linear gauge appearance and behavior
NinetyDegreeGauge PropertiesControl ninety-degree gauge appearance and behavior
RockerSwitch PropertiesControl rocker switch appearance and behavior
SemicircularGauge PropertiesControl semicircular gauge appearance
Switch PropertiesControl switch appearance and behavior
ToggleSwitch PropertiesControl toggle switch appearance and behavior

Topics

App Designer Components

View a list of the user interface components available in App Designer.

Lay Out Apps in App Designer

Learn how to arrange components on the App Designer canvas.

Using Grid Layout Managers

Learn how to use a grid layout manager to lay out an app programmatically.

Apps with Auto-Reflow

Learn about apps that automatically grow, shrink, and reflow content in response to screen-size changes.

Managing Resizable Apps in App Designer

Learn about automatic resize behavior and SizeChangedFcn callbacks in App Designer.

App Designer Keyboard Shortcuts

Learn about App Designer keyboard shortcuts that work in the design view and code view.

App Designer Preferences

Specify which options are always enabled or disabled whenever you work in App Designer.