Main Content

本页翻译不是最新的。点击此处可查看最新英文版本。

App 构建组件

App 设计工具和 UI 图窗支持大量组件，可用于设计功能齐全的现代化应用程序。下表列出了可用的组件。

  • 常用组件 - 包括响应交互的组件，如按钮、滑块、下拉列表和树。

  • 坐标区 - 包括用于创建绘图以进行数据可视化和探查的坐标区。

  • 容器和图窗工具 - 包括用于对组件分组的面板和选项卡，还包括菜单栏。

  • 仪表组件 - 包括用于可视化状态的仪表和信号灯，以及用于选择输入参数的旋钮和开关。

  • 可扩展组件 - 包括您创建的自定义 UI 组件。与第三方库对接以显示小组件或数据可视化等内容。

  • 工具箱组件 - 包括工具箱的 UI 组件。需要安装相应的工具箱并具备许可证。

所有组件都可以通过编程方式使用。App 设计工具组件库中还提供了大多数 UI 组件，您可以将它们拖放到画布上。要向使用 App 设计工具创建的 App 添加组件库中没有的组件，或要将组件动态添加到正在运行的 App，请参阅以编程方式向 App 设计工具添加 UI 组件。

在 App 设计工具中调用图形函数的工作流与通常在 MATLAB® 命令行中使用的工作流略有不同。有关如何在 App 设计工具中调用图形函数的详细信息，请参阅在 App 设计工具中显示图形。

常用组件

组件信息示例
Button 属性

Push button with a bar chart icon to the left of the label "Plot Data"

CheckBox 属性

A cleared check box labeled "Remove Outliers" and a selected check box beneath it labeled "Add Trendline"

DatePicker 属性

An expanded date picker that displays drop-down menus for month and year, and the calendar for your selection. It also has icons that switch the calendar view to the previous month, the current date, or the next month.

DropDown 属性

Two drop-down components. The top drop-down is editable and collapsed. The bottom drop-down component is not editable. It is expanded and shows items "Red", "Green", and "Blue".

NumericEditField 属性

Numeric edit field that shows the number 12. The edit field label is "Sample Size".

EditField 属性

A text edit field for entering a name displays "Cleve"

Hyperlink 属性

A hyperlink with the display text "MathWorks home page" and a tooltip that displays the URL of the MathWorks website.

Image 属性

An image component showing the MathWorks L-shaped Membrane logo

Label 属性

Label that says "Select an Option" in bold font

ListBox 属性

List box with three items: "Red", "Green", and "Blue"

ButtonGroup 属性
RadioButton 属性

Button group labeled "Select a Color" with three vertically stacked radio buttons. From top to bottom, the radio buttons are labeled "Red", "Green", and "Blue".

Slider 属性

Two slider components, both with limits ranging from zero to 100. The slider on the left is in a horizontal orientation. Its value is set to 40. The slider on the right is in a vertical orientation and its value is set to 75.

RangeSlider Properties

Two range slider components, both with limits ranging from zero to 100. The slider on the left is in a horizontal orientation with a range of values between 20 and 60. The slider on the right is in a vertical orientation with a range of values between 10 and 90.

Spinner 属性

Spinner component with its value set to zero

StateButton 属性

Two state buttons stacked vertically. The top button is labeled "Start". It is light gray in color. The bottom button labeled "Stop" is a darker gray.

Table 属性

A table UI component that shows three columns: "LastName", "Age", and "Smoker". The table is sorted by last name in ascending order. The first two cells in the "Age" column are greater than 40 and appear in blue bold font. The third cell in the "Smoker" column shows a selected check box and the background color of the cell is yellow.

TextArea 属性

Text area with the text "This sample might be an outlier"

ButtonGroup 属性
ToggleButton 属性

Toggle button group labeled "Water Temperature (C)". It contains three vertically stacked toggle buttons. From top to bottom the buttons are labeled "0", "40", and "100". The "40" button is a darker gray color.

Tree 属性
TreeNode 属性

A tree with one node called "Samples" that is expanded to show its two nested nodes "Cape Ann" and "Nantucket". Each of these three nodes shows a blue file icon to the left of their label text. The "Cape Ann" node is also expanded to show two nested nodes called "Water Quality" and "Air Quality".

CheckBoxTree 属性
TreeNode 属性

A tree with three parent nodes called "Sedimentary", "Igneous", and "Metamorphic". The node called "Sedimentary" is unchecked and collapsed, the node called "Igneous" is checked and collapsed, and the node called "Metamorphic" is partially checked and expanded to show its nested nodes "Slate" , "Marble", and "Gneiss". Each of the nodes shows a check box to the left of their label text.

坐标区

坐标区信息示例
UIAxes 属性

A mesh surface plot

Axes 属性
此对象只能以编程方式添加。

Two normalized histogram plots in the same axes. A blue histogram is centered near zero and an orange one is centered near one.

GeographicAxes 属性
此对象只能以编程方式添加。

Set of geographic axes that uses the 'colorterrain' basemap. A solid red line is plotted between two points: Imperial Beach, California and San Francisco, California. The two end points are marked with red asterisks.

PolarAxes 属性
此对象只能以编程方式添加。

Scatter chart in polar coordinates

容器和图窗工具

容器信息示例

GridLayout 属性

Grid layout manager shown as selected on the App Designer canvas. The cursor is over the configure icon, and a tooltip next to it says "Configure grid layout".

Panel 属性

Empty panel with the label "Data".

TabGroup 属性
Tab 属性

Tab group with two tabs called "Data" and "Plots". The "Data" tab is selected. It is a lighter gray than the "Plots" tab.

Menu 属性

Menu bar with the "File" menu expanded to show three submenus called "Open", "Save", and "Export"

ContextMenu 属性

A context menu for a date picker component. The context menu has two menu items called "Change Format" and "Restore Defaults".

Toolbar 属性
PushTool 属性
ToggleTool 属性

Custom toolbar that, from left to right, shows an orange download icon, a dark gray email icon, and an orange help icon with a vertical separator to the left of it

对话框和通知

对话框信息示例
uialert
此对象只能以编程方式添加。

An Invalid File dialog box displayed in front of a UI figure. A red octagon icon with a white exclamation point appears to the left of an alert message that says "File not found".

uiconfirm
此对象只能以编程方式添加。

A Confirm Save dialog box with the message "Saving these changes will overwrite previous changes." The options it presents are "Overwrite", "Save as new", and "Cancel".

uiprogressdlg
此对象只能以编程方式添加。

A progress dialog box displayed in front of a UI figure. The message displayed above the progress bar says "Loading your data". A blue progress bar shows that the process is one-third complete.

uisetcolor
此对象只能以编程方式添加。

Color picker dialog box that shows the standard colors, recent colors, and preview of the default color which is set to yellow

uigetfile
此对象只能以编程方式添加。

File selection dialog box

uiputfile
此对象只能以编程方式添加。

Save to file dialog box

uigetdir
此对象只能以编程方式添加。

Folder selection dialog box

uiopen
此对象只能以编程方式添加。

Load file into workspace dialog box

uisave
此对象只能以编程方式添加。

Save workspace variables dialog box

仪表

组件信息示例
Gauge 属性

Circular gauge with limits ranging from zero to 100 and a value set to 60

NinetyDegreeGauge 属性

Ninety degree gauge with limits ranging from zero to 100 and a value set to 60

LinearGauge 属性

Linear gauge with limits ranging from zero to 100 and a value set to 60

SemicircularGauge 属性

Semicircular gauge with limits ranging from zero to 100 and a value set to 60

Knob 属性

Knob with limits ranging from zero to 100. The value is set to zero.

DiscreteKnob 属性

Discrete knob with items, "Off", "Low", "Medium", and "High". The knob value is set to "Off."

Lamp 属性

Lamp component with green color

Switch 属性

Slider switch with the slider to the left in the off position

RockerSwitch 属性

Rocker switch oriented vertically. The bottom of the rocker is pressed into the "Off" position.

ToggleSwitch 属性

Toggle switch oriented vertically. The switch is toggled downward into the "Off" position.

可扩展组件

组件信息示例

matlab.ui.componentcontainer.ComponentContainer 类

matlab.graphics.chartcontainer.ChartContainer 类

Component container that combines a custom chart and custom color picker component along with a check box and a spinner.

HTML 属性

Two HTML UI components stacked vertically. The top component shows formatted text and the bottom component shows a web page.

工具箱组件

在 App 设计工具中创建的或使用 uifigure 函数创建的 App 支持 Aerospace Toolbox 组件。有关详细信息，请参阅Flight Instruments (Aerospace Toolbox)。要使用工具箱组件，需要安装关联的工具箱并具备有效的许可证。

相关主题