react-native-qr-kit
v1.0.5
Published
Fast, fully native QR code toolkit for React Native. Decode single or multiple QR codes from images or base64, and generate QR codes — all offline, on-device, with native Android & IOS performance. Perfect for local QR code scanning and generation in your
Downloads
142
Maintainers
Readme
react-native-qr-kit
A fast, offline, and fully native QR code toolkit for React Native (Android and iOS).
Decode QR codes from images, decode multiple QR codes, decode from base64, and generate QR codes — all locally, with no network required.
✨ Features
- Offline: All QR code operations are performed locally on the device.
- Decode from Image: Extract QR code data from any image file.
- Decode from Base64: Decode QR code from a base64-encoded image string.
- Decode Multiple: Detect and decode multiple QR codes in a single image.
- Generate QR Code: Create QR codes as base64 PNG images.
- Native Performance: Built with native Android and iOS code for speed and reliability.
- Easy Integration: Simple API for React Native apps.
Note:
While the library is fully focused on QR codes, decoding other barcode formats may not work reliably on iOS. See #screenshot below for an example.
📦 Installation
npm install react-native-qr-kitor
yarn add react-native-qr-kitiOS Setup
Run the following commands to install iOS dependencies:
cd ios
pod installAndroid Manual Linking (if needed)
If autolinking does not work, add the package manually in your MainApplication.java/kt:
import com.qrkit.QRKitPackage; // <-- add this import
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
// ...other packages
new QRKitPackage() // <-- add this line
);
}📋 Usage
decodeBase64
Decodes a QR code from a base64-encoded image string.(e.g., "iVBORw0KGgo...")
Example:
import QRKit from 'react-native-qr-kit';
const decodeBase64 = async (base64String) => {
try {
const result = await QRKit.decodeBase64(base64String);
if (result.success) {
console.log('QR Code Data:', result.data);
} else {
console.error('Error:', result.message);
}
} catch (error) {
console.error('Unexpected Error:', error);
}
};Expected Response:
{
success: true,
data: string
}
// or on failure
{
success: false,
message: string
}decodeQR
Decodes a QR code from a local file path.
Example:
import QRKit from 'react-native-qr-kit';
const decodeQR = async (ImagePath) => {
try {
const result = await QRKit.decodeQR(ImagePath);
if (result.success) {
console.log('QR Code Data:', result.data);
} else {
console.error('Error:', result.message);
}
} catch (error) {
console.error('Unexpected Error:', error);
}
};For image choose:
- you can use any library for select image, but i suggest
react-native-image-picker
Expected Response:
{
success: true,
data: string, // QR code content
error: null,
format: string, // QR code format (e.g. 'QR_CODE')
points: string[] // Array of detected points (e.g. ["120.0,45.0", ...])
}
// or on failure
{
success: false,
errorType: string,
message: string,
details?: string,
stack?: string
}decodeMultiple
Decodes multiple QR codes from a local file path.
Example:
import QRKit from 'react-native-qr-kit';
const decodeMultiple = async (ImagePath) => {
try {
const result = await QRKit.decodeMultiple(ImagePath);
if (result.success) {
console.log('QR Codes:', result.results);
} else {
console.error('Error:', result.message);
}
} catch (error) {
console.error('Unexpected Error:', error);
}
};For image choose:
- you can use any library for select image, but i suggest
react-native-image-picker
Expected Response:
{
success: true,
results: [
{ data: string, format: string },
...
]
}
// or on failure
{
success: false,
message: string
}generateQRCode
Generates a QR code as a base64 PNG image.
Example:
import QRKit from 'react-native-qr-kit';
const generateQRCode = async (data, size) => {
try {
const result = await QRKit.generateQRCode(data, size);
if (result.success) {
console.log('Generated QR Code (Base64):', result.base64);
} else {
console.error('Error:', result.message);
}
} catch (error) {
console.error('Unexpected Error:', error);
}
};Expected Response:
{
success: true,
base64: string // PNG image as base64
}
// or on failure
{
success: false,
message: string
}📋 API Reference
decodeQR(path: string): Promise<DecodeResult>
Decode a QR code from a local image file path.
Returns:
{
success: true,
data: string, // QR code content
error: null,
format: string, // QR code format (e.g. 'QR_CODE')
points: string[] // Array of detected points (e.g. ["120.0,45.0", ...])
}
// or on failure
{
success: false,
errorType: string,
message: string,
details?: string,
stack?: string
}decodeBase64(base64Str: string): Promise<DecodeResult>
Decode a QR code from a base64-encoded image string.
Returns:
{
success: true,
data: string
}
// or on failure
{
success: false,
message: string
}decodeMultiple(path: string): Promise<MultiDecodeResult>
Decode multiple QR codes from a local image file path.
Returns:
{
success: true,
results: [
{ data: string, format: string },
...
]
}
// or on failure
{
success: false,
message: string
}generateQRCode(data: string, size: number): Promise<GenerateResult>
Generate a QR code as a base64 PNG image.
Returns:
{
success: true,
base64: string // PNG image as base64
}
// or on failure
{
success: false,
message: string
}Screenshots
ℹ️ Notes
- All QR code decoding and generation is performed offline and locally on the device.
- The library is fully focused on QR codes. Decoding other barcode formats may not work reliably on iOS.
- Works with any local image file path accessible to your app.
📄 License
MIT © getsettalk
