Блог

Я хочу, чтобы сканер штрих-кодов Expo был внутри изображения на экране.

Я использовал vw и vh для ширины и высоты, потому что я хочу, чтобы они менялись в зависимости от объема занимаемого мной пространства на экране. Я пытался обвести его рамкой, но он так и не появился. Я попытался поместить его на вид вокруг сканера штрих-кодов, а также на сам сканер.

Вот фрагмент кода моего сканера штрих-кодов, а также соответствующие стили и скриншот.

 scannerContainer: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    width: vw(100),
    maxHeight: vh(50),
    backgroundColor: 'red',
    borderColor: colors.primary,
    borderWidth: 5
}

<View style={styles.scannerContainer}>
    <BarCodeScanner
        onBarCodeScanned={(hasScan) ? undefined : handleScan}
        barCodeTypes={[BarCodeScanner.Constants.BarCodeType.qr]}
        style={[StyleSheet.absoluteFillObject]}
    />
</View>
 

Вместо использования штрих-кода вы можете использовать expo camera , потому BarCodeScanner что у вас активная проблема.

Вот код

 import { Camera } from 'expo-camera';

<Camera
  onBarCodeScanned={this.onBarCodeScanned}
  ratio='16:9'
  style={StyleSheet.absoluteFillObject}
/>
 

Ссылка: https://github.com/expo/expo/issues/5212