rnx-ui
A UI Lib for React Native
Start
1. Install
npm install rnx-ui --save
2. Use
import React, {
Component,
} from 'react';
import Btn from 'rnx-ui/Btn';
function Demo(props) {
return <Btn />;
}
Demo
将项目克隆至本地后:
1. Install
npm install
2. Run
react-native run-ios
Overview
🖌
designing(6) 🛠
developing(1) ✅
done(32)
Component
Name | Description | State |
---|---|---|
ActionSheet | 上拉按钮组 | |
AddAndSubtract | 加减法动画组件 | |
Alert | 警告弹框 | |
All | 页面容器 | |
Badge | 角标 | |
Btn | 按钮 | |
CardView | 卡片视图 | |
Checkbox | 选择框 | |
Confirm | 确认弹框 | |
Dialog | 对话框 | |
Drop | 掉落动画组件 | |
DynamicText | 文本框(滚动显示过长文字) | |
HeaderedSheet | 有标题栏的底部弹层 | |
Icon | 字体图标 | |
ImgHolder | 带占位的图片 | |
ImgPicker | 图片选择组件 | |
ImgRollView | 图片选择组件 | |
KeyboardAdaptiveView | 适应键盘的容器 | |
Loading | 菊花加载中动画 | |
LoadingBtn | 带菊花图的按钮 | |
NavBar | 导航栏 | |
Number | 数字 | |
NumericKeyboard | 虚拟数字键盘 | |
Overlay | 遮罩层 | |
PhoneNumInput | 手机号码输入框 | |
PlaceholderInput | 可以自定义占位元素的输入框 | |
PlaceholderText | 有占位元素的文本显示组件 | |
Progress | 进度条 | |
RefreshView | 滚动列表(带下拉刷新、上拉加载) | |
Select | 选择器(带有向上弹出和向下隐藏的动画、遮罩、取消确定标题栏) | |
Sheet | 底部弹层 | |
SlideMenu | 侧滑菜单 | |
SmsCaptchaInput | 短信验证码输入框 | |
TabBar | 横向点击栏 | |
ToolTip | 提示框 | |
VirtualPasswordInput | 虚拟密码输入框 | |
Web | 类微信浏览器 |
Util
Name | Description | State |
---|---|---|
transPxToDp | 像素(px)转虚拟像素(dp)方法 | |
Validator | 表单校验工具 |