export default class CameraPetpedia extends React.Component{ state = { hasCameraPermission: null, hasCamerarollPermission:null, };componentDidMount() {this.getCameraPermissions();this.getCameraRollPermissions();}async getCameraPermissions() {const { status } = await Permissions.askAsync(Permissions.CAMERA);if (status === 'granted') { this.setState({ hasCameraPermission: true });} else { this.setState({ hasCameraPermission: false }); console.log('Uh oh! The user has not granted us camera permission.');}}async getCameraRollPermissions() {const { status } = await Permissions.askAsync(Permissions.CAMERA_ROLL);if (status === 'granted') { this.setState({ hasCamerarollPermission: true });} else { console.log('Uh oh! The user has not granted us permission.'); this.setState({ hasCamerarollPermission: false });}}takePicture = async () => { const {uri} = await this.camera.takePictureAsync(); const save = await MediaLibrary.createAssetAsync(uri); console.log(uri) }render() {const { hasCameraPermission } = this.state;if (hasCameraPermission === null) { return <View />;} else if (hasCameraPermission === false) { return <Text>Access to camera has been denied.</Text>;}return (<View><Camera style={styles.openCamera} ref={ref => this.camera = ref} type={this.state.type} focusDepth={1}/><Gallery/> {/* <FontAwesome name="bolt" style={styles.flashcamera}/> */}<ClickButton takePhoto={this.takePicture}/> {/* Camera Flip or selfie */}<Ionicons name="md-reverse-camera" style={styles.cameraFlip} onPress= {() => { this.setState({type:this.state.type === Camera.Constants.Type.back ? Camera.Constants.Type.front: Camera.Constants.Type.back });}}/></View>); }}
camera work's great when the expo on the android device is reloaded, but when I go to other tabs and come back to the camera tab, it shows a black screen as you can see in the picture. this camera code is running great on IOS
devices but not on the android devices. please help me to figure this out.