react-native-quark

An ART-based qrcode component for react-native, which is much faster than those based WebView.

Prerequisite

This library is based on ART and works on both Android and iOS platform.

ART has already been included in react-native, while not avaiable on iOS. Please follow the document to link ART on iOS manually.

Usage

• Install

npm i react-native-quark

• Use it

import React from 'react'
import { StyleSheet, View } from 'react-native'
import Quark from 'react-native-quark'

export default () => (
  <View style={styles.container}>
    <Quark value="Hello!" />
    <Quark value="Quark!" style={styles.quark} />
    <Quark value="您好!" color="navy" />
  </View>
)

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  },
  quark: {
    margin: 40,
    color: 'purple'
  }
})

Prop Types

| Name | Type | Default | Description | | ----------------: | --------- | ------------- | --------------------------------- | | value | string | - | QRCode content, required | | size | ?number | 128 | size of the QRCode | | color | ?string | 'black' | color of the QRCode | | backgroundColor | ?string | 'transparent' | background color of the QRCode | | errorCorrectLevel | ?string | 'M' | errorCorrectLevel of the QRCode | | style | any | null | style of ART.Surface component |

You can set color and backgroundColor in style.

Acknowledge

The word "QR Code" is registered trademark of DENSO WAVE INCORPORATED. And you can use it without any fee, according to QR Code FAQ.

License

MIT