Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
henry-capture-vision-react-native
Advanced tools
henry-capture-vision-react-native - npm Package Compare versions
Comparing version 1.1.0-beta.2 to 1.1.0
| import { BarcodeResult } from './BarcodeResult'; | ||
| import { DBRRuntimeSettings } from "./BarcodeSettings"; | ||
| import { DBRRuntimeSettings, EnumDBRPresetTemplate } from "./BarcodeSettings"; | ||
| export declare class DynamsoftBarcodeReader { | ||
@@ -10,3 +10,3 @@ static initLicense(license: string): Promise<void>; | ||
| outputRuntimeSettingsToString(): Promise<string>; | ||
| updateRuntimeSettings(settings: DBRRuntimeSettings): Promise<boolean>; | ||
| updateRuntimeSettings(settings: DBRRuntimeSettings | EnumDBRPresetTemplate | string): Promise<boolean>; | ||
| startScanning(): Promise<void>; | ||
@@ -13,0 +13,0 @@ stopScanning(): Promise<void>; |
| { | ||
| "name": "henry-capture-vision-react-native", | ||
| "version": "1.1.0-beta.2", | ||
| "version": "1.1.0", | ||
| "description": "Dynamsoft Capture Vision React Native SDK", | ||
@@ -5,0 +5,0 @@ "homepage": "https://www.dynamsoft.com/capture-vision/docs/introduction", |
144
README.md
@@ -22,2 +22,3 @@ # Dynamsoft Capture Vision React-Native Edition | ||
| - [Build Your Barcode Scanner App](#build-your-barcode-scanner-app) | ||
| - [Set up Development Environment](#set-up-development-environment) | ||
| - [Initialize the Project](#initialize-the-project) | ||
@@ -75,2 +76,6 @@ - [Include the Library](#include-the-library) | ||
| ### Set up Development Environment | ||
| If you are a beginner on React Native, please follow the guide on <a href="https://reactnative.dev/docs/environment-setup" target="_blank">React Native official website</a> to set up the development environment. | ||
| ### Initialize the Project | ||
@@ -88,4 +93,16 @@ | ||
| Add the SDK to your new project. Please read the [Installation](#installation) section for more details. Once the SDK is added, you will see a reference to it in the **package.json**. | ||
| Add the SDK to your new project. Once the SDK is added, you will see a reference to it in the **package.json**. | ||
| - **yarn** | ||
| ```bash | ||
| yarn add dynamsoft-capture-vision-react-native | ||
| ``` | ||
| - **npm** | ||
| ```bash | ||
| npm install dynamsoft-capture-vision-react-native | ||
| ``` | ||
| For iOS, you must install the necessary native frameworks from cocoapods to run the application. In order to do this, the `pod install` command needs to be run as such: | ||
@@ -111,6 +128,3 @@ | ||
| DynamsoftCameraView, | ||
| BarcodeResult, | ||
| EnumDBRPresetTemplate, | ||
| EnumBarcodeFormat, | ||
| DBRRuntimeSettings | ||
| EnumBarcodeFormat | ||
| } from 'dynamsoft-capture-vision-react-native'; | ||
@@ -133,22 +147,28 @@ ``` | ||
| ```js | ||
| componentDidMount() { | ||
| (async () => { | ||
| // Initialize the license so that you can use full feature of the Barcode Reader module. | ||
| try { | ||
| await DynamsoftBarcodeReader.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9") | ||
| } catch (e) { | ||
| console.log(e); | ||
| } | ||
| // Create a barcode reader instance. | ||
| this.reader = await DynamsoftBarcodeReader.createInstance(); | ||
| // Enable video barcode scanning. | ||
| // If the camera is opened, the barcode reader will start the barcode decoding thread when you triggered the startScanning. | ||
| // The barcode reader will scan the barcodes continuously before you trigger stopScanning. | ||
| await this.reader.startScanning(); | ||
| // Add a result listener. The result listener will handle callback when barcode result is returned. | ||
| this.reader.addResultListener((results) => { | ||
| // Update the newly detected barcode results to the state. | ||
| this.setState({results}); | ||
| }); | ||
| })(); | ||
| class App extends React.Component { | ||
| ... | ||
| componentDidMount() { | ||
| (async () => { | ||
| // Initialize the license so that you can use full feature of the Barcode Reader module. | ||
| try { | ||
| await DynamsoftBarcodeReader.initLicense("DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9"); | ||
| } catch (e) { | ||
| console.log(e); | ||
| } | ||
| // Create a barcode reader instance. | ||
| this.reader = await DynamsoftBarcodeReader.createInstance(); | ||
| // Add a result listener. The result listener will handle callback when barcode result is returned. | ||
| this.reader.addResultListener((results) => { | ||
| // Update the newly detected barcode results to the state. | ||
| this.setState({results}); | ||
| }); | ||
| // Enable video barcode scanning. | ||
| // If the camera is opened, the barcode reader will start the barcode decoding thread when you triggered the startScanning. | ||
| // The barcode reader will scan the barcodes continuously before you trigger stopScanning. | ||
| this.reader.startScanning(); | ||
| })(); | ||
| } | ||
| ... | ||
| } | ||
@@ -160,7 +180,11 @@ ``` | ||
| ```js | ||
| async componentWillUnmount() { | ||
| // Stop the barcode decoding thread when your component is unmount. | ||
| await this.reader.stopScanning(); | ||
| // Remove the result listener when your component is unmount. | ||
| this.reader.removeAllResultListeners(); | ||
| class App extends React.Component { | ||
| ... | ||
| async componentWillUnmount() { | ||
| // Stop the barcode decoding thread when your component is unmount. | ||
| await this.reader.stopScanning(); | ||
| // Remove the result listener when your component is unmount. | ||
| this.reader.removeAllResultListeners(); | ||
| } | ||
| ... | ||
| } | ||
@@ -173,30 +197,38 @@ ``` | ||
| ```js | ||
| render() { | ||
| // Add code to fetch barcode text and format from the BarcodeResult | ||
| let results = this.state.results; | ||
| let resultBoxText = ""; | ||
| if (results && results.length>0){ | ||
| for (let i=0;i<results.length;i++){ | ||
| resultBoxText+=results[i].barcodeFormatString+"\n"+results[i].barcodeText+"\n"; | ||
| ```jsx | ||
| class App extends React.Component { | ||
| ... | ||
| render() { | ||
| // Add code to fetch barcode text and format from the BarcodeResult | ||
| let results = this.state.results; | ||
| let resultBoxText = ""; | ||
| if (results && results.length>0){ | ||
| for (let i=0;i<results.length;i++){ | ||
| resultBoxText+=results[i].barcodeFormatString+"\n"+results[i].barcodeText+"\n"; | ||
| } | ||
| } | ||
| // Render DynamsoftCameraView componment. | ||
| return ( | ||
| <DynamsoftCameraView | ||
| style={ | ||
| { | ||
| flex: 1 | ||
| } | ||
| } | ||
| ref = {(ref)=>{this.scanner = ref}} | ||
| overlayVisible={true} | ||
| > | ||
| {/*Add a text box to display the barcode result.*/} | ||
| <Text style={ | ||
| { | ||
| flex: 0.9, | ||
| marginTop: 100, | ||
| textAlign: "center", | ||
| color: "white", | ||
| fontSize: 18, | ||
| } | ||
| }>{results && results.length > 0 ? resultBoxText : "No Barcode Detected"}</Text> | ||
| </DynamsoftCameraView> | ||
| ); | ||
| } | ||
| // Render DynamsoftCameraView componment. | ||
| return ( | ||
| <DynamsoftCameraView | ||
| style={{ | ||
| flex: 1, | ||
| }} | ||
| ref = {(ref)=>{this.scanner = ref}} | ||
| isOverlayVisible={true} | ||
| > | ||
| <Text style={{ | ||
| flex: 0.9, | ||
| marginTop: 100, | ||
| textAlign: "center", | ||
| color: "white", | ||
| fontSize: 18, | ||
| }}>{results && results.length > 0 ? resultBoxText : "No Barcode Detected"}</Text> | ||
| </DynamsoftCameraView> | ||
| ); | ||
| } | ||
@@ -203,0 +235,0 @@ ``` |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.56%
168066
- Number of low quality alerts
- decreased by-100%
0
- Number of lines in readme file
- increased by12.96%
279
No dependency changes