hy-ui

虎牙小程序UI库，可兼容（app | web）端

总览

• 组件 - 开发虎牙小程序所用到的组件
• 全局变量 - 例如：sdk, device等等接口，辅助我们开发
• 注册 - 小程序启动的方法，一般用在entry文件
• 其他 - 开发规范，实现原理

组件

Usage

import { UI } from '@hyext/hy-ui'
const { View, Text } = UI

基础内容

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Text | ✓ | 文本 | | Icon | ✓ | 图标 | | Button | ✓ | 按钮 |

视图容器

| 组件名称 | 实现状态 | 备注 | | - | - | - | | View | ✓ | 视图 | ScrollView | ✓ | 滚动视图 | | Swiper | ✓ | 轮播视图 | | BackgroundImage | ✓ | 背景视图 | | Topview | ✓ | 顶层视图 |

媒体组件

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Image | ✓ | 图片 | | SvgImage | ✓ | Svg图片(ios, web) | | Audio | ✗ | 音频 | | Video | ✗ | 视频 |

操作反馈

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Modal | ✓ | 自定义modal | | SlideModal | ✓ | 自定义方向弹出modal | | BottomModal | ✓ | 底部弹出modal | | Tip | ✓ | 提示 | | Dialog | ✓ | msgbox |

数据输入

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Input | ✓ | 文本输入框 | | Checkbox | ✓ | 多选钮 | | Radio | ✓ | 单选钮 | | Switch | ✓ | 开关 | | Stepper | ✓ | 计数器 | | Form | ✓ | 表单 | | Slider | ✓ | 拖动条 | | Progress | ✓ | 进度条 | | Picker | ✓ | 选择器 | | Scrollpicker | ✓ | 滚动选择器 | | Datepicker | ✓ | 日期选择器 | | Timepicker | ✓ | 时间选择器 | | Cascader | ✓ | 级联选择器 |

画图

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Canvas | ✗ | 画布 | | Svg | ✓ | Svg系列组件 (ios, web) |

导航

| 组件名称 | 实现状态 | 备注 | | - | - | - | | Route | ✗ | 路由 |

全局变量

global.__device - 设备信息

• device.window.height 屏幕高度
• device.window.width屏幕宽度

global.__os - 操作系统

global.hyExt - 前端小程序SDK接口

注册

注：由builder-beyond生成的模版，已经为用户增加了注册app的代码

import { registerApp } from '@hyext/hy-ui'
import App from './hy-ui-demo/app'

registerApp('hy-ui-demo', App)

其他

• 实现原理
• 开发规范