No ean8 or ean13 Barcode scanned on front camera

Hello,

I am currently using the expo-camera api to identify barcodes (ean8 & ean 13) and take pictures of products. I did manage to identify barcodes using the back camera, but can’t identify (ean8 and ean13) barcodes with the front camera, even thought the expo qr code works for example. My guess is, that the focus does not work good enough, but I can’t come up with a proof.

I wrote an example (slightly changed code from documentation), that should console.log if a barcode was found. On back camera it works, on front camera it does not. Test device is an iPhone XR 13.3.1 with current Expo App.

Example:

import React, { useState, useEffect } from 'react';
import { Text, View, TouchableOpacity } from 'react-native';
import { Camera } from 'expo-camera';

export default function App() {
  const [hasPermission, setHasPermission] = useState(null);
  const [type, setType] = useState(Camera.Constants.Type.back);

  useEffect(() => {
    (async () => {
      const { status } = await Camera.requestPermissionsAsync();
      setHasPermission(status === 'granted');
    })();
  }, []);

  if (hasPermission === null) {
    return <View />;
  }
  if (hasPermission === false) {
    return <Text>No access to camera</Text>;
  }
  return (
    <View style={{ flex: 1 }}>
      <Camera style={{ flex: 1 }} type={type} onBarCodeScanned={(type, data) => console.log("Barcode found")} autoFocus={Camera.Constants.AutoFocus.on}>
        <View
          style={{
            flex: 1,
            backgroundColor: 'transparent',
            flexDirection: 'row',
          }}>
          <TouchableOpacity
            style={{
              flex: 0.1,
              alignSelf: 'flex-end',
              alignItems: 'center',
            }}
            onPress={() => {
              setType(
                type === Camera.Constants.Type.back
                  ? Camera.Constants.Type.front
                  : Camera.Constants.Type.back
              );
            }}>
            <Text style={{ fontSize: 18, marginBottom: 10, color: 'white' }}> Flip </Text>
          </TouchableOpacity>
        </View>
      </Camera>
    </View>
  );
}

package.json for example:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "expo": "~37.0.3",
    "expo-barcode-scanner": "~8.1.0",
    "expo-camera": "~8.2.0",
    "expo-permissions": "~8.1.0",
    "react": "~16.9.0",
    "react-dom": "~16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
    "react-native-web": "~0.11.7"
  },
  "devDependencies": {
    "@babel/core": "^7.8.6",
    "babel-preset-expo": "~8.1.0"
  },
  "private": true
}

Any idea how to fix this / work around this?

Thank you very much!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.