MATLAB Creating Graphical User Interfaces

App Packaging

Create a Simple App Programmatically 3-
- Create a Code File 3-
- Create the Figure Window....................... 3-
- Add Components to the UI 3-
- Code the App’s Behavior......................... 3-
- Verify Code and Run the App 3-

What Is GUIDE?

GUIDE: Getting Started 4-
- UI Layout 4-
- UI Programming............................... 4-

GUIDE Preferences and Options

GUIDE Preferences............................... 5-
- Set Preferences............................... 5-
- Confirmation Preferences........................ 5-
- Backward Compatibility Preference................ 5-
- All Other Preferences........................... 5-

GUIDE Options.................................. 5-
- The GUI Options Dialog Box..................... 5-
- Resize Behavior 5-
- Command-Line Accessibility 5-
- Generate FIG-File and MATLAB File............... 5-
- Generate FIG-File Only......................... 5-

Lay Out a UI Using GUIDE

GUIDE Templates................................. 6-
- Access the Templates 6-
- Template Descriptions 6-

Set the UI Window Size in GUIDE.................. 6-
- 6- Prevent Existing Objects from Resizing with the Window
- Set the Window Position or Size to an Exact Value.... 6-
- Maximize the Layout Area...................... 6-

Add Components to the GUIDE Layout Area.......... 6-
- Place Components............................ 6-
- User Interface Controls........................ 6-
- Panels and Button Groups....................... 6-
- Axes 6-
- Table 6-
- ActiveX Component 6-
- Resize GUIDE UI Components................... 6-

Align GUIDE UI Components 6-
- Align Objects Tool............................. 6-
- Property Inspector............................ 6-
- Grid and Rulers 6-
- Guide Lines 6-

Customize Tabbing Behavior in a GUIDE UI 6-

Create Menus for GUIDE Apps 6-
- Menus for the Menu Bar 6-
- Context Menus 6-

Create Toolbars for GUIDE UIs..................... 6-
- Toolbar and Tools............................. 6-
- Editing Tool Icons 6-

Design Cross-Platform UIs in GUIDE............... 6-
- Default System Font.......................... 6-
- Standard Background Color.................... 6-
- Cross-Platform Compatible Units................ 6-

Programming a GUIDE App

Write Callbacks in GUIDE 7-
- Callbacks for Different User Actions 7-
  - 7- GUIDE-Generated Callback Functions and Property Values
- GUIDE Callback Syntax......................... 7-
- Renaming and Removing GUIDE-Generated Callbacks.. 7-

Initialize UI Components in GUIDE Apps............. 7-
- Opening Function.............................. 7-
- Output Function 7-

Callbacks for Specific Components 7-
- How to Use the Example Code 7-
- Push Button................................. 7-
- Toggle Button................................ 7-
- Radio Button................................ 7-
- Check Box 7-
- Edit Text Field............................... 7-
- Slider 7-
- List Box.................................... 7-
- Pop-Up Menu 7-
- Panel 7-
- Button Group 7-
- Menu Item.................................. 7-
- Table 7-
- Axes 7-

Examples of GUIDE Apps 7-

Examples of GUIDE UIs

Modal Dialog Box in GUIDE........................ 8-
- Create the Dialog Box........................... 8-
- Create the Program That Opens the Dialog Box 8-
- Run the Program.............................. 8-

GUIDE App With Parameters for Displaying Plots...... 8-
- Open and Run the Example 8-
- Examine the Code 8-

GUIDE App Containing Tables and Plots............. 8-

Interactive List Box App in GUIDE.................. 8-
- Open and Run The Example..................... 8-
- Examine the Layout and Callback Code............ 8-

Plot Workspace Variables in a GUIDE App........... 8-
- Open and Run the App......................... 8-

Automatically Refresh Plot in a GUIDE App.......... 8-

Lay Out a Programmatic UI

Structure of Programmatic App Code Files............ 9-
- File Organization 9-
- File Template 9-
- Run the Program.............................. 9-

Add Components to a Programmatic App............. 9-
- User Interface Controls......................... 9-
- Tables 9-
- Panels..................................... 9-
- Button Groups............................... 9-
- Axes 9-
- ActiveX Controls.............................. 9-
- How to Set Font Characteristics.................. 9-

Lay Out a UI Programmatically.................... 9-
- Component Placement and Sizing................. 9-
- Managing the Layout in Resizable UIs 9-
- Manage the Stacking Order of Grouped Components 9-

Customize Tabbing Behavior in a Programmatic App.. 9-
- How Tabbing Works........................... 9-
- Default Tab Order............................. 9-
- Change the Tab Order in the uipanel 9-

Create Menus for Programmatic Apps 9-
- Add Menu Bar Menus.......................... 9-
- Add Context Menus to a Programmatic App 9-

Create Toolbars for Programmatic Apps 9-
- Use the uitoolbar Function...................... 9-
- Commonly Used Properties...................... 9-
- Toolbars.................................... 9-
- Display and Modify the Standard Toolbar........... 9-

DPI-Aware Behavior in MATLAB................... 9-
- Visual Appearance 9-
- Using Object Properties........................ 9-
- Using print, getframe, and publish Functions........ 9-

Code a Programmatic App

Initialize a Programmatic App 10-
- Examples................................... 10-

Write Callbacks for Apps Created Programmatically... 10-
- Callbacks for Different User Actions 10-
- How to Specify Callback Property Values........... 10-

Manage Application-Defined Data

Share Data Among Callbacks 11-
- Overview of Data Sharing Techniques 11-
- Store Data in UserData or Other Object Properties.... 11-
- Store Data as Application Data 11-
  - 11- Create Nested Callback Functions (Programmatic Apps)
- Store Data Using the guidata Function............ 11-
- GUIDE Example: Share Slider Data Using guidata... 11-
- GUIDE Example: Share Data Between Two Apps 11-
- GUIDE Example: Share Data Among Three Apps.... 11-

Manage Callback Execution

Interrupt Callback Execution...................... 12-
- How to Control Interruption..................... 12-
- Callback Behavior When Interruption is Allowed...... 12-
- Example 12-

Examples of Programmatic Apps

Programmatic App that Displays a Table............. 13-

App Designer Basics

Create and Run a Simple App Using App Designer.... 14-
- Run the Tutorial.............................. 14-
- Tutorial Steps for Creating the App............... 14-

Migrating GUIDE Apps to App Designer 14-
- Features of the Migration Tool................... 14-
- Aids for Migrating GUIDE Code to App Designer..... 14-

Displaying Graphics in App Designer.............. 14-
- Calling Graphics Functions 14-
- Displaying Plots Using Other Types of Axes........ 14-
- Unsupported Functionality..................... 14-

App Designer Preferences 14-

Component Choices and Customizations

App Designer Components........................ 15-
- Common Components.......................... 15-
- Containers and Figure Tools 15-
- Instrumentation.............................. 15-
- Toolbox Components 15-

Table Array Data Types in App Designer Apps 15-
- Logical Data................................ 15-
- Categorical Data 15-
- Datetime Data 15-
- Duration Data............................... 15-
- Nonscalar Data............................. 15-
- Missing Data Values.......................... 15-
- Example: App that Displays a Table Array.......... 15-
- Identifying Editable Sections of Code 17-
- Programming Your App......................... 17-
- Fixing Coding Problems and Run-Time Errors........ 17-

Startup Tasks and Input Arguments in App Designer.. 17-

Create a StartupFcn Callback.................... 17-

Define Input App Arguments..................... 17-

Creating Multiwindow Apps in App Designer 17-

Overview of the Process 17-

Send Information to the Dialog Box.............. 17-

Return Information to the Main App.............. 17-

Manage Windows When They Close.............. 17-

Example: Plotting App That Opens a Dialog Box..... 17-

Write Callbacks in App Designer.................. 17-

Create a Callback Function..................... 17-

Using Callback Function Input Arguments......... 17-

Searching for Callbacks in Your Code............. 17-

Deleting Callbacks........................... 17-

Example: App with a Slider Callback............. 17-

Create Helper Functions in App Designer 17-

Create a Helper Function...................... 17-

Managing Helper Functions 17-
- Displays Updated Data...................... 17-

Share Data Within App Designer Apps............. 17-

17- Example: Share Plot Data and a Drop-Down List Selection

17- Compatibility Between Different Releases of App Designer
- Save Copy As Versus Save As................... 17-
- Opening Apps for Editing in a Newer Release....... 17-

17- Use One Callback for Multiple App Designer Components
- Example of a Shared Callback 17-
- Change or Disconnect a Callback................ 17-

Packaging GUIs as Apps

Apps Overview 20-
- What Is an App?.............................. 20-
- Where to Get Apps 20-
- Why Create an App?........................... 20-
  - 20- Best Practices and Requirements for Creating an App

Package Apps From the MATLAB Toolstrip........... 20-

Package Apps in App Designer..................... 20-

Modify Apps................................... 20-

Ways to Share Apps............................. 20-
- Share MATLAB Files Directly................... 20-
- Package Your App 20-
- Create a Deployed Web App.................... 20-
- Create a Standalone Desktop Application 20-

MATLAB App Installer File — mlappinstall 20-

Dependency Analysis............................ 20-

MATLAB Creating Graphical User Interfaces

App Packaging

Get our desktop app

Company

Features

Documentation

Resources