launchCamera() in react-native-image-picker doesn't open anything when installed on a device

Question

amazing developers. I am building an app that would offer opportunity to either take a photo on spot and upload it, or choose an image from gallery. I am using react-native-image-picker for it. So far, my life was going great and everything ran smoothly on the emulator, however, once I installed the APK file on my android device, pressing the camera button didn't do anything. No errors, no permission request, nothing at all. On emulator I didn't have any errors in console and it worked perfect.

Here is the state:

const [pickerResponse, setPickerResponse] = useState(null);

And buttons with the onPress() functions:

          <Button
            title='Take A Photo'
            color="darkgray"
            onPress={() => launchCamera({mediaType: 'photo', saveToPhotos: true}, setPickerResponse)}
          />
          <Button
            title='Open Gallery'
            color="darkgray"
            onPress={() => launchImageLibrary({mediaType: 'photo'}, setPickerResponse)}
          />

I am only having this issue with launchCamera and not with launchImageLibrary. I added these permissions:

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-feature android:name="android.hardware.camera" />

But they didn't make a difference and instead made my emulator stop working.

It's my first ever react native app so a little push in the right direction would be highly appreciated. Wish you a great weekend.

Answer 1

So the problem was and what I had tried before was just to grant permission for the camera and not storage. Since in my case saveToPhotos is set to true, additional storage access permission was required. Hopefully this will help some other newbie like me in the future.

const requestCameraPermission = async () => {
try {
  const granted = await PermissionsAndroid.request(
    PermissionsAndroid.PERMISSIONS.CAMERA,
    {
      title: "App Camera Permission",
      message:"App needs access to your camera ",
      buttonNeutral: "Ask Me Later",
      buttonNegative: "Cancel",
      buttonPositive: "OK"
    }
  );
  const grantedGallery = await PermissionsAndroid.request(
    PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
    {
      title: "App Gallery Permission",
      message:"App needs access to your photos",
      buttonNeutral: "Ask Me Later",
      buttonNegative: "Cancel",
      buttonPositive: "OK"
    }
  );
  if (granted === PermissionsAndroid.RESULTS.GRANTED && grantedGallery === PermissionsAndroid.RESULTS.GRANTED) {
    console.log("Camera permission given");
    launchCamera({mediaType: 'photo', saveToPhotos: true}, setPickerResponse)
  } else {
    console.log("Camera permission denied");
  }
} catch (err) {
  console.warn(err);
}

};

Answer 2

Try changing this line of code:

onPress={() => launchImageLibrary({mediaType: 'photo'}, setPickerResponse)

to this one:

onPress={() => launchImageLibrary({mediaType: 'photo'}, res => setPickerResponse(res))

It looks like you are not passing the callback response properly.