鸿蒙 ArkUI 提供了丰富的 UI 组件，涵盖了布局、基础 UI、输入、容器、手势、动画、高级组件、网络与存储、适配等多个方面。以下是完整的 ArkUI 控件总结，方便你快速查阅和理解鸿蒙的 UI 组件体系。
📌 1. 布局控件（Layout Components）
| 控件 | 作用 |
|---|---|
| Row | 横向排列 子组件 |
| Column | 纵向排列 子组件 |
| Flex | 弹性布局，支持主轴对齐、换行、自动填充等 |
| List | 滚动列表，适用于数据较多的列表 |
| ListItem | List 的子项，每个列表项 |
| Grid | 网格布局，支持多列显示 |
| Stack | 层叠布局，子组件可自由重叠 |
| Tabs | 选项卡布局，用于页面切换 |
| Scroll | 滚动视图，可支持横向/纵向滚动 |
| Swiper | 轮播图，用于多张图片/页面的切换 |
| Divider | 分割线，用于区分不同内容区域 |
| Panel | 可折叠面板，用于展开/收起内容 |
📌 2. 基础 UI 控件（Basic UI Components）
| 控件 | 作用 |
|---|---|
| Text | 文本显示，支持字体、颜色、样式 |
| Image | 图片显示，支持本地/网络图片 |
| Button | 按钮，用于点击交互 |
| Icon | 图标，内置常用图标，可自定义 |
| Badge | 徽章，用于显示通知数字/状态 |
| Marquee | 跑马灯，用于滚动显示文本 |
| Progress | 进度条，支持线性进度、环形进度 |
| Loading | 加载动画，用于显示加载状态 |
| Rating | 评分组件，用于展示/输入评分 |
| Divider | 分割线，用于区分内容区域 |
📌 3. 输入控件（Form Components）
| 控件 | 作用 |
|---|---|
| TextInput | 文本输入框，支持单行/多行输入 |
| Search | 搜索框，带搜索图标 |
| DatePicker | 日期选择器，支持年月日选择 |
| TimePicker | 时间选择器，支持时分秒选择 |
| Checkbox | 复选框，用于多选 |
| Radio | 单选框，用于单选 |
| Toggle | 开关按钮，用于开/关状态切换 |
| Slider | 滑动条，用于音量、亮度等调节 |
| Picker | 滚动选择器，适用于省市区、数字选择 |
📌 4. 容器控件（Container Components）
| 控件 | 作用 |
|---|---|
| Navigation | 导航栏，用于页面跳转 |
| TabBar | 底部导航栏，用于切换不同页面 |
| Toolbar | 顶部工具栏，可放置标题、按钮 |
| Dialog | 弹窗，用于确认/提示用户 |
| Popover | 弹出框，用于菜单或提示 |
| Sheet | 底部弹出菜单 |
| SideBar | 侧边栏，用于导航菜单 |
📌 5. 手势与动画（Gesture & Animation）
| 控件 | 作用 |
|---|---|
| Gesture | 手势识别（点击、滑动、长按） |
| Draggable | 拖拽组件，可用于拖拽排序 |
| Transition | 动画过渡效果 |
| AnimationController | 动画控制器，用于复杂动画 |
| MotionPath | 路径动画，让元素沿自定义路径运动 |
📌 6. 高级控件（Advanced Components）
| 控件 | 作用 |
|---|---|
| Web | 嵌入网页，显示 HTML 内容 |
| Canvas | 自定义绘制，适用于绘图 |
| Video | 视频播放 |
| Map | 地图组件 |
| QRCode | 二维码扫描与生成 |
📌 7. 状态管理（State Management）
| 方式 | 作用 |
|---|---|
| @State | 组件内部状态，组件变化时自动更新 UI |
| @Prop | 父组件向子组件传值 |
| @Link | 双向绑定 |
| @Observed | 监听对象的变化，更新 UI |
| @ObjectLink | 更复杂的数据绑定 |
📌 8. 网络请求与数据存储
| 方式 | 作用 |
|---|---|
| HttpRequest | 进行 HTTP 请求，支持 GET/POST |
| DataStore | 轻量级本地存储（类似 SharedPreferences） |
| SQLite | 本地数据库存储 |
| File | 读写本地文件 |
| WebSocket | 长连接，如聊天功能 |
📌 9. 适配与多端支持
| 技术点 | 作用 |
|---|---|
| Breakpoint | 屏幕断点适配 |
| WindowSizeClass | 根据设备窗口大小适配 UI |
| @MediaQuery | 适配不同屏幕尺寸 |
| MultiDeviceSync | 多设备协同（手机、平板、智能手表） |
| ArkTS | 一次开发，多端运行 |
✅ 总结
鸿蒙 ArkUI 组件体系非常丰富，可以满足布局、基础 UI、输入、动画、存储、网络请求、适配等各种需求。
