跳到主要内容
版本:v8

UI 组件

Ionic 应用由称为组件的高层构建块构成,可让您快速构建应用的 UI。Ionic 内置了多种组件,包括卡片、列表和标签页。熟悉基础知识后,请参阅API 索引以获取每个组件及子组件的完整列表。

Accordion

手风琴组件可在内容中提供可折叠的区域,以减少垂直空间占用,同时提供组织和分组信息的方式。

Action Sheet

操作菜单显示一组选项,具备确认或取消操作的能力。

Alert

警告框是让用户选择特定操作或操作列表的绝佳方式。

Badge

徽章是一种小组件,通常用于向用户传达数值信息。

Breadcrumbs

面包屑导航是用于指示用户在应用中当前位置的导航项。

Button

按钮让您的用户执行操作,是与应用交互和导航的重要方式。

Card

卡片是展示重要内容的绝佳方式,可包含图片、按钮、文本等更多元素。

Checkbox

复选框可用于让用户知晓他们需要做出二元选择。

Chip

纸片是一种以紧凑方式显示数据或操作的方式。

Content

内容区域是与应用交互和导航的基本方式。

Date & Time Pickers

日期和时间选择器用于提供一个让用户轻松选择日期和时间的界面。

Floating Action Button

浮动操作按钮是执行屏幕主要操作的圆形按钮。

Grid

网格是一个强大的移动优先系统,用于构建自定义布局。

Icons

设计精美的图标,适用于 Web、iOS 和 Android 应用。

Infinite Scroll

无限滚动允许您在用户滚动应用时加载新数据。

Inputs

输入框为用户提供了在应用中输入数据的方式。

Item

列表项是可包含文本、图标、头像、图片、输入框以及任何其他原生或自定义元素的组件。 列表项可以被滑动、删除、排序、编辑等。

List

列表可以显示信息行,例如联系人列表、播放列表或菜单。

Media

一组媒体组件,包括头像、图标、图片和缩略图,旨在增强视觉内容的展示。

Menu

菜单是一种常见的导航模式,可以常驻在屏幕上,也可以在需要时显示。

Modal

模态框滑入和滑出屏幕以显示临时 UI,通常用于登录或注册页面。

Navigation

导航是用户在应用的不同页面之间移动的方式。

Popover

Popover 提供了一种在不切换上下文的情况下呈现信息或选项的简便方式。

Progress Indicators

进度指示器可视化展示操作或活动的进度。

Radio

单选输入允许您呈现一组互斥的选项。

Range

范围滑块让用户通过沿轨道拖动旋钮来选择值。

Refresher

Refresher 为内容组件提供下拉刷新功能。

Reorder

Reorder 让用户通过拖放来重新排序列表项。

Routing

路由允许基于当前路径进行导航。

Searchbar

搜索栏用于搜索或过滤项目,通常位于工具栏中。

Segment

分段提供一组互斥的按钮,可用作过滤器或视图切换器。

Select

Select 类似于原生 HTML 的选择框,在排序和选择方面进行了一些改进。

Tabs

标签页支持标签式导航,这是现代应用中标准的导航模式。

Toast

Toast 是一种微妙的通知,出现在应用内容上方,不会中断用户交互。

Toggle

开关是用于二元选项的输入组件,常用于设置和开关选项。

Toolbar

工具栏用于放置与您的应用相关的信息和操作。

Typography

文本用于设置应用内文本的样式或更改颜色。