/rnx-ui

A UI Lib for React Native

Primary LanguageJavaScriptMIT LicenseMIT

rnx-ui

Build Status npm npm GitHub license

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 表单校验工具