控制
.NET 多平台应用 UI (.NET MAUI) 应用的用户界面由映射到每个目标平台的本机控件的对象构造。
重要
.NET 多平台应用 UI (.NET MAUI) 目前为预览版。 此内容与发布前可能进行实质性修改的预发布产品相关。 对于此处提供的信息,Microsoft 不作任何明示或暗示的担保。
用于创建 .NET MAUI 应用的用户界面的主要控件组是页面、布局和视图。 .NET MAUI 页面通常占据全屏或窗口。 页面通常包含一个布局,其中包含视图和其他布局。 页面、布局和视图派生自 VisualElement
类。 此类提供在派生类中有用的各种属性、方法和事件。
注意
ListView
还 TableView
支持使用单元格。 单元格是用于表中项的专用元素,用于描述每个项的呈现方式。
页
.NET MAUI 应用由一个或多个页面组成。 页面通常占用所有屏幕或窗口,每个页面通常包含至少一个布局。
.NET MAUI 包含以下页面:
页 | 说明 |
---|---|
ContentPage |
ContentPage 显示单个视图,并且是最常见的页面类型。 有关详细信息,请参阅 ContentPage。 |
FlyoutPage |
FlyoutPage 是一个页面,用于管理两个相关的信息页 - 一个显示项目的浮出控件页面,以及一个详细信息页面,用于显示浮出控件页面上的项目的详细信息。 有关详细信息,请参阅 FlyoutPage。 |
NavigationPage |
NavigationPage 提供分层导航体验,你可以根据需要浏览页面、向前和向后导航。 有关详细信息,请参阅 NavigationPage。 |
TabbedPage |
TabbedPage 由页面顶部或底部的选项卡导航的一系列页面组成,每个选项卡加载页面内容。 有关详细信息,请参阅 TabbedPage。 |
布局
.NET MAUI 布局用于将用户界面控件组合到视觉结构中,每个布局通常包含多个视图。 布局类通常包含用于设置子元素的位置和大小的逻辑。
.NET MAUI 包含以下布局:
Layout | 说明 |
---|---|
AbsoluteLayout |
AbsoluteLayout 相对于其父元素的特定位置放置子元素。 有关详细信息,请参阅 AbsoluteLayout。 |
BindableLayout |
BindableLayout 允许任何布局类通过绑定到项集合来生成其内容,并可以选择设置每个项的外观。 有关详细信息,请参阅 BindableLayout。 |
FlexLayout |
FlexLayout 使子级可以堆叠或包装使用不同的对齐和方向选项。 FlexLayout 基于 CSS 灵活框布局模块,称为 弹性布局 或 弹性框。 有关详细信息,请参阅 FlexLayout。 |
Grid |
Grid 将其子元素放置在行和列的网格中。 有关详细信息,请参阅 网格。 |
HorizontalStackLayout |
HorizontalStackLayout 将子元素置于水平堆栈中。 有关详细信息,请参阅 HorizontalStackLayout。 |
StackLayout |
StackLayout 将子元素置于垂直或水平堆栈中。 有关详细信息,请参阅 StackLayout。 |
VerticalStackLayout |
VerticalStackLayout 定位垂直堆栈中的子元素。 有关详细信息,请参阅 VerticalStackLayout。 |
视图
.NET MAUI 视图是 UI 对象,例如标签、按钮和滑块,这些对象通常称为其他环境中的 控件 或 小组件 。
.NET MAUI 包含以下视图:
视图 | 说明 |
---|---|
ActivityIndicator |
ActivityIndicator 使用动画来显示应用从事冗长的活动,而不给出任何进度指示。 有关详细信息,请参阅 ActivityIndicator。 |
BlazorWebView |
BlazorWebView 使你能够在 .NET MAUI 应用中托管 Blazor Web 应用。 有关详细信息,请参阅 BlazorWebView。 |
Border |
Border 是一个容器控件,用于在另一个控件周围绘制边框、背景或两者。 有关详细信息,请参阅 边框。 |
BoxView |
BoxView 绘制指定宽度、高度和颜色的矩形或正方形。 有关详细信息,请参阅 BoxView。 |
Button |
Button 显示文本并响应点击或单击,指示应用执行任务。 有关详细信息,请参阅 按钮。 |
CarouselView |
CarouselView 显示数据项的可滚动列表,用户在其中轻扫以在集合中移动。 有关详细信息,请参阅 CarouselView。 |
CheckBox |
CheckBox 使你能够使用可以选中或为空的按钮类型选择布尔值。 有关详细信息,请参阅 CheckBox。 |
CollectionView |
CollectionView 使用不同的布局规范显示可选数据项的可清理列表。 有关详细信息,请参阅 CollectionView。 |
ContentView |
ContentView 是一个控件,用于创建自定义的可重用控件。 有关详细信息,请参阅 ContentView。 |
DatePicker |
DatePicker 允许使用平台日期选取器选择日期。 有关详细信息,请参阅 DatePicker。 |
Editor |
Editor 使你可以输入和编辑多行文本。 有关详细信息,请参阅 编辑器。 |
Ellipse |
Ellipse 显示椭圆或圆。 有关详细信息,请参阅 椭圆。 |
Entry |
Entry 使你可以输入和编辑单行文本。 有关详细信息,请参阅 Entry。 |
Frame |
Frame 用于用颜色、阴影和其他选项配置的边框包装视图或布局。 有关详细信息,请参阅 Frame。 |
GraphicsView |
GraphicsView 是一个图形画布,可以使用命名空间中的类型 Microsoft.Maui.Graphics 绘制 2D 图形。 有关详细信息,请参阅 GraphicsView。 |
Image |
Image 显示可从本地文件、URI、嵌入资源或流加载的图像。 有关详细信息,请参阅 Image。 |
ImageButton |
ImageButton 显示图像并响应点击或单击该点击,指示应用执行任务。 有关详细信息,请参阅 ImageButton。 |
IndicatorView |
IndicatorView 显示表示项 CarouselView 数的指示器。 有关详细信息,请参阅 IndicatorView。 |
Label |
Label 显示单行和多行文本。 有关详细信息,请参阅 标签。 |
Line |
Line 显示从起点到终点的线条。 有关详细信息,请参阅 Line。 |
ListView |
ListView 显示可滚动的数据项列表。 有关详细信息,请参阅 ListView。 |
Path |
Path 显示曲线和复杂形状。 有关详细信息,请参阅 路径。 |
Picker |
Picker 显示一个简短的项列表,可从中选择一个项。 有关详细信息,请参阅 选取器。 |
Polygon |
Polygon 显示多边形。 有关详细信息,请参阅 多边形。 |
Polyline |
Polyline 显示一系列连接的直线。 有关详细信息,请参阅 折线。 |
ProgressBar |
ProgressBar 使用动画显示应用正在经历较长的活动。 有关详细信息,请参阅 ProgressBar。 |
RadioButton |
RadioButton 是一种按钮类型,允许从集中选择一个选项。 有关详细信息,请参阅 RadioButton。 |
Rectangle |
Rectangle 显示矩形或正方形。 有关详细信息,请参阅 矩形。 |
RefreshView |
RefreshView 是一个容器控件,它为可滚动内容提供拉取刷新功能。 有关详细信息,请参阅 RefreshView。 |
RoundRectangle |
RoundRectangle 显示带圆角的矩形或正方形。 有关详细信息,请参阅 矩形。 |
ScrollView |
ScrollView 提供其内容的滚动,通常是布局。 有关详细信息,请参阅 ScrollView。 |
SearchBar |
SearchBar 是用于启动搜索的用户输入控件。 有关详细信息,请参阅 SearchBar。 |
Slider |
Slider 使你可以从连续范围中选择一个 double 值。 有关详细信息,请参阅 滑块。 |
Stepper |
Stepper 使你能够从一系列增量值中选择一个 double 值。 有关详细信息,请参阅 Stepper。 |
SwipeView |
SwipeView 是一个容器控件,它环绕内容项,并提供由轻扫手势显示的上下文菜单项。 有关详细信息,请参阅 SwipeView。 |
Switch |
Switch 使你能够使用可打开或关闭的按钮类型选择布尔值。 有关详细信息,请参阅 Switch。 |
TableView |
TableView 显示可滚动项的表,可分组到节中。 有关详细信息,请参阅 TableView。 |
TimePicker |
TimePicker 使你能够使用平台时间选取器选择时间。 有关详细信息,请参阅 TimePicker。 |
WebView |
WebView 显示网页或本地 HTML 内容。 有关详细信息,请参阅 WebView。 |