react-native-barcode

Getting started

$ npm install react-native-barcode-zxing --save

$3

$ react-native link react-native-barcode-zxing

$3

#### iOS

1. please update rn to 0.60.* and use autolink

#### Android

1. please update rn to 0.60.* and use autolink

#### Windows
Read it! :D

1. In Visual Studio add the RNBarcode.sln in node_modules/react-native-barcode/windows/RNBarcode.sln folder to their solution, reference from their app.
2. Open up your MainPage.cs app
- Add using Barcode.RNBarcode; to the usings at the top of the file
- Add new RNBarcodePackage() to the List returned by the Packages method

Usage Encode

``javascript
import React, { Component } from 'react';
import { StyleSheet, View, Picker, Button, Image } from 'react-native';
import RNBarcode from 'react-native-barcode-zxing';

export default class EncodeApp extends Component {

constructor(props) {
super(props);

this.onEncodePress = this.onEncodePress.bind(this);

this.state = {
imagesrc: ""
}
}

onEncodePress() {
const self = this;
const options = {
'type' : 'pdf417', // types
'code' : '12345',
'width' : 200,
'height' : 200
}
RNBarcode.encode(options, (error, blob) => {
if (error) {
console.error(error);
} else {
let baseImg = data:image/png;base64,${blob};
self.setState({
imagesrc: baseImg
})
}
})
}

render() {
return (

title="Encode"
onPress={this.onEncodePress}
color="#841584">


);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
barcode: {
width: 200,
height: 200,
backgroundColor: '#FF0000',
}
});

`

Usage BarcodeView

`javascript
import { BarcodeView } from 'react-native-barcode-zxing';

export default class BarcodeComponent extends Component {

render() {
return (

format="DATA_MATRIX"
style={{ height: 200, width: 200 }} />

)
}
}
``

$3

- qrcode
- code39
- isbn10
- code128
- upca
- upce
- ean13
- ean8
- itf
- databar
- databarexp
- isbn13
- pdf417
- codabar
- aztec