Skip to content

Instantly share code, notes, and snippets.

@Ganesh1991
Last active January 29, 2024 13:24
Show Gist options
  • Save Ganesh1991/4fd95971e03d434065e934e672518e04 to your computer and use it in GitHub Desktop.
Save Ganesh1991/4fd95971e03d434065e934e672518e04 to your computer and use it in GitHub Desktop.
SDK50 expo-camera/next scanner not working on ios but working on android
import React, { useState } from "react";
import { Text, View, StyleSheet, Button } from "react-native";
import { CameraView, useCameraPermissions } from "expo-camera/next";
import { TouchableOpacity } from "react-native-gesture-handler";
export default function CodeScanner({ handleScan, closeScanner }) {
const [type, setType] = useState("back");
const [permission, requestPermission] = useCameraPermissions();
if (!permission) {
// Camera permissions are still loading
return <View />;
}
if (!permission.granted) {
// Camera permissions are not granted yet
return (
<View style={styles.container}>
<Text style={{ textAlign: "center" }}>
We need your permission to show the camera
</Text>
<Button onPress={requestPermission} title="grant permission" />
</View>
);
}
const handleBarCodeScanned = ({ type, data }) => {
console.log("🚀 ~ handleBarCodeScanned ~ data");
console.log(
`Bar code with type ${type} and data ${data} has been scanned!`
);
handleScan(data);
};
function toggleCameraType() {
setType((current) =>
current === CameraType.back ? CameraType.front : CameraType.back
);
}
return (
<View style={styles.container}>
<CameraView
style={styles.camera}
// facing={type}
onBarcodeScanned={handleBarCodeScanned}
barcodeScannerSettings={{
barCodeTypes: [
"qr",
"pdf417",
"ean13",
"code128",
"code39",
"upc_a",
"upc_e",
"ean8",
"itf14",
"interleaved2of5",
"codabar",
"aztec",
"datamatrix",
"code93",
"itf14",
],
}}
>
<View style={styles.buttonContainer}>
<TouchableOpacity style={styles.button} onPress={closeScanner}>
<Text style={styles.text}>Back</Text>
</TouchableOpacity>
</View>
</CameraView>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: "center",
alignItems: "stretch",
height: "100%",
},
camera: {
flex: 1,
alignItems: "stretch",
},
buttonContainer: {
flex: 1,
flexDirection: "row",
backgroundColor: "transparent",
margin: 64,
padding: 16,
},
button: {
flex: 1,
alignSelf: "flex-end",
alignItems: "center",
},
text: {
fontSize: 24,
fontWeight: "bold",
color: "white",
},
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment