探索React Native二维码扫描器：React Native Qrcode Scanner

import React, { useEffect, useState } from 'react';
import { Text, View, StyleSheet, Button } from 'react-native';
import QRCodeScanner from 'react-native-qrcode-scanner';
import { useNavigation } from '@react-navigation/native';
 
const QrCodeScannerScreen = () => {
  const navigation = useNavigation();
  const [scanned, setScanned] = useState(false);
 
  const handleBarCodeScanned = ({ data }) => {
    setScanned(true);
    navigation.navigate('Details', { code: data });
  };
 
  if (scanned) {
    return (
      <View style={styles.container}>
        <Text>Detection success! Redirecting...</Text>
      </View>
    );
  }
 
  return (
    <View style={styles.container}>
      <QRCodeScanner
        onRead={handleBarCodeScanned}
        flashMode={QRCodeScanner.Constants.FlashMode.torch}
        showFrame={true}
        cameraStyle={styles.camera}
      />
      <Button title="Close" onPress={() => navigation.goBack()} />
    </View>
  );
};
 
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  camera: {
    height: 300,
    width: 300,
  },
});
 
export default QrCodeScannerScreen;

这段代码使用React Native Qrcode Scanner库创建了一个二维码扫描器屏幕，并展示了如何使用该库的基本功能。代码中包含了一个二维码扫描器组件和一个处理扫描结果的函数。扫描成功后，会导航到一个新的屏幕（这里假设为'Details'），并将扫描数据传递过去。