@hyext/hy-ui

A ui lib for hy miniapp

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@hyext/hy-ui
1.6.15 months ago4 years agoMinified + gzip package size for @hyext/hy-ui in KB

Readme

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)

其他