MATLAB App Building

Introduction to Creating Apps About Apps in MATLAB Software Ways to Build Apps Build an App Build a Live Editor Task How to Create a App with GUIDE Files Generated by GUIDE Code Files and FIG-Files Code File Structure Adding Callback Templates to an Existing Code File About GUIDE-Generated Callbacks App Designer App Designer Basics Create and Run a Simple App Using App Designer Run the Tutorial Tutorial Steps for Creating the App GUIDE Migration Strategies Export GUIDE App to MATLAB File Migrate GUIDE App to App Designer Display Graphics in App Designer App Designer Graphics Overview Display Graphics on Existing Axes Display Graphics in Container Create Axes Programmatically Use Functions with No Target Argument Use Functions That Don't Support Automatic Resizing Unsupported Functionality App Designer Preferences Component Choices and Customizations App Building Components Common Components Axes Containers and Figure Tools Dialogs and Notifications Instrumentation Extensible Components Toolbox Components Display Tabular Data in Apps Logical Data Categorical Data Datetime Data Duration Data Nonscalar Data Missing Data Values Example: App That Displays a Table Add UI Components to App Designer Programmatically Create the Component and Assign the Callback Write the Callback Example: Confirmation Dialog Box with a Close Function Example: App that Populates Tree Nodes Based on a Data File Create HTML File That Can Trigger or Respond to Data Changes Include Setup Function in Your HTML File Sample HTML File Debug an HTML File Add Tables to App Designer Apps Create Table and Configure Table Behavior Populate Table Data Example: App That Displays a Table App Layout Lay Out Apps in App Designer Design View Customize Components Align and Space Components Group Components Reorder Components Modify Tab Focus Order of Components Arrange Components in Containers Create and Edit Context Menus in App Designer Manage Resizable Apps in App Designer Resizing Graphics Objects with Normalized Position Units Alternatives to Default Auto-Resize Behaviors Use Grid Layout Managers in App Designer Add and Configure Grid Layout Manager Convert Components from Pixel-Based Positions to Grid Layout Manager Convert Components from Grid Layout Manager to Pixel-Based Positions Example: Convert Components to Use Grid Layout Manager Instead of Pixel-Based Positions Apps with Auto-Reflow What is Auto-Reflow? Create New App with Auto-Reflow Convert Existing App to Use Auto-Reflow Remove Auto-Reflow Behavior Example: App with Auto-Reflow App Programming Manage Code in App Designer Code View Manage Components, Functions, and Properties Identify Editable Sections of Code Program Your App Fix Code Problems and Run-Time Errors Personalize Code View Appearance Startup Tasks and Input Arguments in App Designer Create a startupFcn Callback Define Input App Arguments Create Multiwindow Apps in App Designer Overview of the Process Send Information to the Dialog Box Return Information to the Main App Manage Windows When They Close Example: Plotting App That Opens a Dialog Box Callbacks in App Designer Create Callback Functions Program Callback Functions Share Callbacks Between Multiple Components Create and Assign Callbacks Programmatically Search for Callbacks in Your Code Change or Disconnect Callbacks Delete Callbacks Example: App with a Slider Callback Reuse Code Using Helper Functions Create a Helper Function Managing Helper Functions Example: Helper Function That Initializes Plots and Displays Updated Data Share Data Within App Designer Apps Define a Property Access a Property Example: Share Plot Data and a Drop-Down List Selection Compatibility Between Different Releases of App Designer Save Copy As Versus Save As Opening Apps for Editing in a Newer Release Use One Callback for Multiple App Designer Components Example of a Shared Callback App Designer Examples App That Calculates and Plots Data Based on Numerical Input App with Auto-Reflow That Updates Plot Based on User Selections App That Uses Grid Layout to Manage Component Positions and Resizing App That Displays Data in a Hierarchy Using Tree Create App That Uses Multiple Axes to Display Results of Image Analysis Create Polar Axes Programmatically in an App Create App with a Table That Can Be Sorted and Edited Interactively Create App with Timer Object Configured Programmatically Create App with Timer Object That Queries Website Data Share Data in Multiwindow Apps Display HTML Elements Styled by a Cascading Style Sheet Advanced App Designer Examples Organize App Data Using MATLAB Classes Open App Designer App Write a MATLAB Class to Manage App Data Test Algorithm Share Data with App Pulse Generator App That Stores Data in a Class Create Responsive Apps Improve Startup Time Improve Update Time Improve Resize Behavior Improve Responsiveness to User Input Improve Performance of Graphics in Your App Improve App Startup Time Improve Startup Time in Apps with Multiple Tabs Improve Startup Time in Apps with Large Trees Find and Create UI Components and Charts Find Community-Authored Components and Charts Create Your Own Components and Charts Keyboard Shortcuts App Designer Keyboard Shortcuts Shortcuts Available Throughout App Designer Component Browser Shortcuts Design View Shortcuts Code View Shortcuts Create UIs Programmatically Lay Out a Programmatic UI Lay Out Apps Programmatically Manage Figure Size and Location Lay Out UI Components Change Front-to-Back Component Order Manage App Resize Behavior Programmatically Use a Grid Layout Manager Write Code to Manage Resize Behavior Turn Off Resizing of Specific Components Turn Off App Resizing Entirely DPI-Aware Behavior in MATLAB Visual Appearance Using Object Properties Using print, getframe, and publish Functions Create and Manage Callbacks Programmatically Create Callbacks for Apps Created Programmatically Callback Function Arguments Specify a Callback Function Share Data Among Callbacks Store App Data Access App Data From Callback Functions Access Data in UserData Pass Input Data to Callbacks Create Nested Callback Functions Interrupt Callback Execution Interrupted Callback Behavior Control Callback Interruption Behavior Developing Classes of UI Component Objects Develop Custom UI Components Programmatically Structure of a UI Component Class Constructor Method Public and Private Property Blocks Event Block Setup Method Update Method Example: Color Selector UI Component Manage Properties of Custom UI Components Programmatically Initialize Property Values Validate Property Values Customize the Property Display Optimize the update Method Example: Optimized Polynomial Fit UI Component with Customized Property Display Configure Custom UI Components for App Designer Custom UI Component Prerequisites Configure Custom UI Component View Configured UI Component in App Designer Reconfigure Custom UI Component Remove UI Component from App Designer Share Configured UI Component Troubleshoot Missing Custom UI Component Customize Properties of HTML UI Components Custom Component Overview RoundButton Class Implementation Create Custom UI Components in App Designer Create a Simple Custom UI Component in App Designer Component Creation Overview Design Component Appearance Design Component Interface Verify Component Behavior Configure Component for Use in Apps Define Custom UI Component Startup Tasks in App Designer Component Setup Overview Add PostSetupFcn Callback Example: Timer Component That Performs Startup Tasks Create Public Properties for Custom UI Components in App Designer Create New Public Property Configure Public Property Verify Public Property Full Example: FileSelector Component Create Callbacks for Custom UI Components in App Designer Relationship Between Events and Public Callbacks Create New Event Notify Event to Execute Callback Verify Callback Full Example: FileSelector Component Write Property Set Methods for Custom UI Components in App Designer IP Address Component Overview Create a Property Set Method Perform Custom Property Validation Verify Property Validation Behavior Modularize Your App by Creating a Custom UI Component Verify Behavior of Custom UI Components in App Designer Run Component Create Component from Command Window Add Component to App Create Custom UI Component with a Chart in App Designer Create Custom Button with Hover Effect Using HTML Create Event Data for Custom UI Component Callbacks View Default Event Data Define Custom Event Data Example: UI Component with Custom Event Data Transition or Maintain figure-Based Apps Update figure-Based Apps to Use uifigure Overview for Updating Your App Capabilities Only Available with UI Figures Differences Between figure-Based and uifigure-Based Apps Update App Figure and Containers Replace Calls to figure with uifigure Adjust Container Positions Update UIControl Objects and Callbacks Replace uicontrol Function Calls Update Component Properties Update Callbacks Update Dialog Boxes Examples of Programmatic Apps Create and Run a Simple Programmatic App Programmatic App That Displays a Table Style Cells in a Table UI Component Create Table UI Component Modify Background Color of Table Rows Display Icons in Table Cells Format Equations and Symbols in Table Column Remove Style Live Editor Task Development Live Editor Task Development Overview Define Live Editor Task Subclass Configure Live Editor Task Metadata Use Custom Live Editor Task Create Simple Live Editor Task Share Live Editor Tasks Create UIs with GUIDE GUIDE Preferences and Options GUIDE Preferences Set Preferences Confirmation Preferences Backward Compatibility Preference All Other Preferences GUIDE Options The GUI Options Dialog Box Resize Behavior Command-Line Accessibility Generate FIG-File and MATLAB File Generate FIG-File Only Lay Out a UI Using GUIDE Set the UI Window Size in GUIDE Prevent Existing Objects from Resizing with the Window Set the Window Position or Size to an Exact Value Maximize the Layout Area Add Components to the GUIDE Layout Area Place Components User Interface Controls Panels and Button Groups Axes Table Resize GUIDE UI Components Create Menus for GUIDE Apps Menus for the Menu Bar Context Menus Programming a GUIDE App Write Callbacks in GUIDE Callbacks for Different User Actions GUIDE-Generated Callback Functions and Property Values GUIDE Callback Syntax Share Data Among GUIDE Callbacks GUIDE Example: Share Slider Data Using guidata GUIDE Example: Share Data Between Two Apps GUIDE Example: Share Data Among Three Apps Renaming and Removing GUIDE-Generated Callbacks Callbacks for Specific Components How to Use the Example Code Push Button Toggle Button Radio Button Check Box Edit Text Field Slider List Box Pop-Up Menu Panel Button Group Menu Item Table Axes Examples of GUIDE UIs GUIDE App With Parameters for Displaying Plots Open and Run the Example Examine the Code Interactive List Box App in GUIDE Open and Run the Example Examine the Layout and Callback Code Automatically Refresh Plot in a GUIDE App Open and Run the Example Examine the Code App Packaging Packaging GUIs as Apps Get and Create Apps What Is an App? Where to Get Apps Why Create an App? Best Practices and Requirements for Creating an App Package Apps From the MATLAB Toolstrip Package Apps in App Designer Modify Apps Ways to Share Apps Share MATLAB Files Directly Package Your App Create a Deployed Web App Create a Standalone Desktop Application MATLAB App Installer File — mlappinstall App Packaging Dependency Analysis