Following the guidance provided in Expo Docs on how to use a camera, I have noticed that when I press the flip button, the state of the camera type changes from 0 to 1 and vice versa, but the camera always remains on the back side.
This is my implementation of the CameraComponent:
export default class CameraComponent extends Component {
state = {
hasCameraPermission: null,
type: Camera.Constants.Type.back,
};
async componentWillMount() {
const { status } = await Permissions.askAsync(Permissions.CAMERA);
this.setState({ hasCameraPermission: status === 'granted' });
}
render() {
console.log('camera ==>', this.state.type);
const { hasCameraPermission } = this.state;
if (hasCameraPermission === null) {
return <View />;
} else if (hasCameraPermission === false) {
return <Text>No access to camera</Text>;
}
return (
<View style={{ flex: 1 }}>
<Camera style={{ flex: 1 }}>
<View style={{flex: 1,backgroundColor: 'transparent',flexDirection:'row',}}/>
<View style={{flexDirection: 'row',justifyContent: 'space-between',paddingHorizontal: 10, marginBottom: 15,alignItems: 'flex-end',}}>
<Icon name="md-reverse-camera"
onPress={() => { console.log('flip pressed');
this.setState({
type:
this.state.type === Camera.Constants.Type.back
? Camera.Constants.Type.front
: Camera.Constants.Type.back,
});
}}
/>
</View>
</Camera>
</View>
);
}
}