react-native-barcode-svg

React Native component to generate barcode. Uses @react-native-community/react-native-svg.

Usage no npm install needed!

<script type="module">
  import reactNativeBarcodeSvg from 'https://cdn.skypack.dev/react-native-barcode-svg';
</script>

README

react-native-barcode-svg

React Native component to generate barcode, without display text/value.

Uses JsBarcode for encoding of data.

Uses @react-native-community/react-native-svg instead of @react-native-community/art.

Getting started

Step 1

Install react-native-barcode-svg and dependencies:

npm install react-native-barcode-svg react-native-svg
yarn add react-native-barcode-svg react-native-svg

Step 2

Start using the component

import Barcode from 'react-native-barcode-svg';

<Barcode value="Hello World" format="CODE128" />;

Supported formats:

You can find more info about the supported barcode formats (EG.: CODE128, EAN13, EAN8, UPC, ITF, ...) in the:
JsBarcode README
JsBarcode Barcode Generator

Properties

Property Description
value What the barcode stands for (required).
format Which barcode type to use (default: CODE128). https://github.com/lindell/JsBarcode/blob/master/src/barcodes/index.js
singleBarWidth Width of a single bar (default: 2)
maxWidth Max-width of the barcode (default: undefined, no-limitation)
height Height of the barcode (default: 100)
lineColor Color of the bars and text (default: #000000)
backgroundColor Background color of the barcode (default: #FFFFFF)
onError Handler for invalid barcode of selected format