CODEWITHSUNDEEP
androidiosreact-native
user10591888
user10591888

Reputation:

Open camera in view not on fullscreen in react native

I am trying to open camera in a view, I have set the view height and width, But it's opening in fullscreen. I have used react-native-camera and react-native-image-crop-picker libraries. Below is the code which I used to achieve above:

rendercamera = () =>{
    ImagePicker.openCamera({
        width: width*0.5,
        height: 400,
        cropping: true,
    }).then(image => {
        console.log(image);
    });
}
render() {
    return (
      <View style={styles.containers}>
        <ScrollView>
          <View style={styles.header}>
            <TouchableOpacity onPress={this._goBack}>
              <Image
                style={styles.backicon}
                source={images.backArrowAn}
              />
            </TouchableOpacity>
            <Text style={styles.headerText}>Add Id Card</Text>
            <View style={styles.backicon}></View>
          </View>

          <View
            style={{
              width: width,
              alignItems: "flex-end",
              justifyContent: "center",
              marginTop: height * 0.12,
              alignSelf: "center",
              alignItems: "flex-end"
            }}
          >
          {this.rendercamera()}
          </View>
        </ScrollView>
      </View>
    );
}

Can anyone please help with the same?

Upvotes: 2

Views: 3802

Answers (1)

Max Djafarov
Max Djafarov

Reputation: 99

Your package ImagePicker don't have abilities to do that. Try to use react-native-camera

<RNCamera
      ref={ref => {
        this.camera = ref;
      }}
      style={{//Your style code
        }}
      type={RNCamera.Constants.Type.back}
      flashMode={RNCamera.Constants.FlashMode.on}
      androidCameraPermissionOptions={{
        title: 'Permission to use camera',
        message: 'We need your permission to use your camera',
        buttonPositive: 'Ok',
        buttonNegative: 'Cancel',
      }}
      androidRecordAudioPermissionOptions={{
        title: 'Permission to use audio recording',
        message: 'We need your permission to use your audio',
        buttonPositive: 'Ok',
        buttonNegative: 'Cancel',
      }}
      onGoogleVisionBarcodesDetected={({ barcodes }) => {
        console.log(barcodes);
      }}
    />

Upvotes: 1

Related Questions