创建自定义 UI 组件
R2026a创建您自己的可重用自定义 UI 组件，以在 App 中使用
创建您自己的自定义 UI 组件，以在您的 App 中使用或与其他人共享。您可以使用自定义组件来扩展现有 UI 组件功能，将大型 App 分解为独立且可维护的部件，并为用户设计界面，以便在多个 App 中自定义和重用某个组件。在 App 设计工具中以交互方式创建自定义组件，或通过创建 ComponentContainer 基类的子类以编程方式创建自定义组件。在这两种情况下，您都可以将组件配置为在使用 App 设计工具创建的 App 中以交互方式使用。
类
matlab.ui.componentcontainer.ComponentContainer | 用于开发自定义 UI 组件对象的基类 |
方法
函数
appdesigner.customcomponent.configureMetadata | 配置在 App 设计工具中使用的自定义 UI 组件 |
appdesigner.customcomponent.removeMetadata | 从 App 设计工具中删除自定义 UI 组件 |
主题
在 App 设计工具中创建组件
- Create a Simple Custom UI Component in App Designer
Walk through the basic steps to interactively create a simple custom UI component. - Create Public Properties for Custom UI Components in App Designer
Create and validate custom UI component property values by specifying data types, default values, and property validation functions. - Create Callbacks for Custom UI Components in App Designer
Create public callbacks for your custom UI component that can be used to program the component behavior in an app. - Define Custom UI Component Startup Tasks in App Designer
Perform one-time startup tasks when a custom UI component is first created in an app. - Verify Behavior of Custom UI Components in App Designer
Verify that the public properties, callbacks, and display of your component appear and behave as expected. - Write Property Set Methods for Custom UI Components in App Designer
Perform custom validation of public properties by writing set methods for those properties. - Create Event Data for Custom UI Component Callbacks
Define event data associated with a callback that provides information about a user interaction. - Write Tests for Custom UI Component
Write automated tests to verify the behavior of a custom UI component.
以编程方式创建组件
- Develop Custom UI Components Programmatically
Walk through the basic steps to author a custom UI component class using MATLAB® functions. - Manage Properties of Custom UI Components Programmatically
Validate property values, optimize how properties update, and customize how properties display for the UI components you author. - Create Custom UI Component With HTML
Use HTML UI components to author custom UI component classes with more flexibility.
使用和共享组件
- Configure Custom UI Components for App Designer
Enable interactive use of your custom UI components in App Designer. - Configure Property Display for Custom UI Components in App Designer
Design public properties of your component to enable users to easily use the component in an App Designer app.
精选示例
Create Custom UI Component with a Chart in App Designer
Create a custom UI component that allows app creators to plot data in an interactive chart.
Create Custom Button with Hover Effect Using HTML
Create a custom button component that changes appearance when a user hovers over it in an app.
Modularize Your App by Creating a Custom UI Component
Modularize an App Designer app by separating out a portion of the layout as a custom UI component.
