react-native-quikkly-scanner

0.0.8 • Public • Published

react-native-quikkly-scanner

Getting started

$ npm install react-native-quikkly-scanner --save

Mostly automatic installation

$ react-native link react-native-quikkly-scanner

Manual installation

Android

  1. Open up android/app/src/main/java/[...]/MainActivity.java
  • Add import com.getwala.quikkly.reactnative.ReactNativeQuikklyScannerPackage; to the imports at the top of the file
  • Add new ReactNativeQuikklyScannerPackage() to the list returned by the getPackages() method
  1. Append the following lines to android/settings.gradle:
    include ':react-native-react-native-quikkly-scanner'
    project(':react-native-react-native-quikkly-scanner').projectDir = new File(rootProject.projectDir,  '../node_modules/react-native-react-native-quikkly-scanner/android')
  2. Insert the following lines inside the dependencies block in android/app/build.gradle:
        compile project(':react-native-react-native-quikkly-scanner')
  3. Add your quikkly api key to your appManifest
        <meta-data
            android:name="QUIKKLY_API_KEY"
            android:value="mySuperSecretLongKey" />
     
  4. Add the ScanQuikklyCode Activity to your manifest
     <activity android:name="com.getwala.quikkly.reactnative.ScanQuikklyCodeActivity"></activity>
     
     <activity android:name="com.getwala.quikkly.reactnative.GenerateQuikklyCodeActivity"></activity>
     

Usage

Scanning

import ReactNativeQuikklyScanner from 'react-native-quikkly-scanner';
 
    // Opens the quikkly scanner. On code detection returns a promise with the code.
    ReactNativeQuikklyScanner.scanQuikklyCode().then((quikklyScannedCode) => {
      console.log(quikklyScannedCode);
    }).catch((error) => {
     //handle error here
    });
 

Generating

The imagePath needs to be a path on the device where the image is stored, I would recommend using react-native-cached-image'

 
import CachedImage from 'react-native-cached-image';
const ImageCacheProvider = CachedImage.ImageCacheProvider;
 
 ImageCacheProvider.getCachedImagePath(options.imagePath, {})
    .then(imagePath => {
      options.imagePath = imagePath;
      ReactNativeQuikklyScanner.GenerateCode(options);
    })
 
options = {
    "templateName" : "", //string defaults to "template0002style5"
    "quikklyCode" : "", // string. This is what the scannable will return when scanned
    "backgroundColor":"", // will default to "#5cb7a6"
    "borderColor":"", // defaults to "#ffffff"
    "dataColor":"", // defaults to #000000"
    "maskColor":"", // defaults to "#5cb7a6"
    "overlayColor":"", // defaults to // "#ffffff"
    "imagePath": "" // defaults to "https://s3-eu-west-1.amazonaws.com/qkly-service-albums/temp_icons/squiddy.png"
}
 
 

Package Sidebar

Install

npm i react-native-quikkly-scanner

Weekly Downloads

1

Version

0.0.8

License

None

Last publish

Collaborators

  • jmaleonard