Skip to content

uiwjs/react-native-uiw

Repository files navigation


React Native UIW

A UI component library based on React Native (Android & iOS).

快速上手 | 参与组件开发 | 参与文档/网站编辑开发 | 组件库

您可以使用我们制定的模版(@uiw/react-native-template)创建一个新项目:

# 此模板默认集成了一些必用的依赖,如路由,组件库等
npx react-native init AwesomeProject --template @uiw/react-native-template

Install

yarn add @uiw/react-native react-native-svg@13.9.0 react-native-root-siblings@4.1.1  react-native-gesture-handler@2.8.0

Theme Configuration

项目App.tsx文件配置

//...其他import
import { ThemeProvider } from '@uiw/react-native';

const App = () => {
  return <ThemeProvider>{/** 其他Provider */}</ThemeProvider>;
};

export default App;

Basic Usage

import React from 'react';
import { View } from 'react-native';
import { Icon } from '@uiw/react-native'

export default class Demo extends React.Component {
  render() {
    return (
      <View>
        <Icon name='apple' size={46} color='#50CB42' />
      </View>
    )
  }
}

Other

Development

# Install current dependencies, and dependencies in sub-packages
yarn install
yarn run build # Compile package

Real-time monitoring of package and document website local preview

# Step 1
yarn run lib:watch      # Compile and output JS file
# Step 2
yarn run lib:watch:type # Output type file d.ts
# Step 3
yarn run start          # Run the preview document website locally

文档本地预览

第一步安装文档包和预览工具

 npm install @uiw/react-native-doc @kkt/doc -D # yarn add @uiw/react-native-doc @kkt/doc -D

第二步配置命令

package.json文件中配置命令

  // ... 
  "scripts":{
    "doc":"kktd @uiw/react-native-doc/doc/build"
  }

License

Licensed under the MIT License.