使用React Native进行条形码扫描 [英] Barcode scanning using react native

问题描述

我正在使用react-native-camera构建适用于Android和iOS的条形码扫描仪.

我能够在iOS中扫描条形码，但问题是扫描边界没有视觉效果.我希望整个屏幕都能够扫描条形码，而不仅仅是屏幕中间.

有什么办法解决吗? 如果还有其他图书馆也对我有用.

解决方案

好一整天，我终于找到了一个可以正常工作的图书馆.如果有人在这里找到自己的方式，并且正在寻找可在Android上运行的React Native条形码扫描器...我在这里为您提供帮助.

https://github.com/ideacreation/react-native-barcodescanner

如果您没有rnpm，请先获取它...这非常有帮助！(npm install -g rnpm)( https://github.com/rnpm/rnpm )

然后在您的项目文件中运行以下命令:

npm install --save react-native-barcodescanner

rnpm链接react-native-barcodescanner

这时我同步了gradle并从android studios重新运行了该应用程序...不确定是否需要它(有时rnpm链接会忘记换行符...如果您收到关于include的单词的错误消息，因为这只是在您的setting.gradle文件中找到它，所以在包含这个词之前添加了新行)

现在可以使用了.

导入:

import BarcodeScanner from 'react-native-barcodescanner';

然后在渲染函数的返回语句中使用它:

<BarcodeScanner
    onBarCodeRead={this._BarCodeRead}
    style={styles.preview}
    torchMode='off'
    cameraType='back'
  />

如果您需要更多信息，请查看该链接.我希望这可以帮助某人避免在旧的图书馆不起作用之后遭受图书馆的折磨.

祝您编程愉快！ :)

I am using react-native-camera to build a barcode scanner for Android and iOS both.

I am able to scan the barcode in iOS but the issue is there is no visual for the scanning boundary. And I want the whole screen to be able to scan the bar code not just the middle of the screen.

Is there any way around it? If there is some other library that would also work for me.

解决方案

Well it took me all day but I finally found a library that worked. If anyone finds their way here and is looking for a barcode scanner for react native that works on android...I am here to help.

https://github.com/ideacreation/react-native-barcodescanner

1st if you do not have rnpm get it...it is very helpful!(npm install -g rnpm)(https://github.com/rnpm/rnpm)

then run these commands in your project file:

npm install --save react-native-barcodescanner

rnpm link react-native-barcodescanner

at this point I synced gradle and reran the app from android studios...not sure if it is needed(also sometimes rnpm link forgets a new line character...if you have an error message about the word include it is because this...just find it in your setting.gradle file add a new line before the word include)

now it is ready to use.

import it:

import BarcodeScanner from 'react-native-barcodescanner';

then use it in your render function's return statment:

<BarcodeScanner
    onBarCodeRead={this._BarCodeRead}
    style={styles.preview}
    torchMode='off'
    cameraType='back'
  />

If you need more info check out that link. I hope this helped someone avoid the torture I endured going through library after old library that did not work.

Happy coding! :)

这篇关于使用React Native进行条形码扫描的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！