やりたいこと
react-nativeを用いたネイティブアプリで、バーコードを生成し、外部の端末で読み込みがしたい。
読み込み時に端末の明るさを明るくし、読み込みやすい状態にしたい。
使用するパッケージ
バーコード生成にはreact-native-barcode-builder
端末の明るさを変更するにはreact-native-device-brightnessを使う
上記パッケージだと今後サポートされなくなりますよというwarningが気になったため、@adrianso/react-native-device-brightnessを使います。
npm i react-native-barcode-builder --save
npm i @adrianso/react-native-device-brightness --save
実装
バーコード
各コードを生成し表示したいコンポーネントで以下をimportする
import QRCode from 'react-native-qrcode';
import Barcode from 'react-native-barcode-builder';
表示したい箇所に以下コードを書く
<QRCode
value={"0123456789"}
size={200}
bgColor='black'
fgColor='white'
/>
<Barcode value={"0123456789"} format="CODE128" />
生成と表示はこれだけ。
後は外部のコンポーネントからpropsでデータを渡すなりで汎用的にする。
デバイスの明るさ
以下をimportする
import DeviceBrightness from '@adrianso/react-native-device-brightness';
任意のメソッドでDeviceBrightness~を読み込む
onEnter={() => DeviceBrightness.setBrightnessLevel(1)}
onExit={() => DeviceBrightness.setBrightnessLevel(0)}