CODEWITHSUNDEEP
iosreact-native
J.Ko
J.Ko

Reputation: 8711

React Native/iOS Camera Permission: Show alert to turn on permission from settings for users who disallowed camera access?

I am building an app using React Native and photo upload is one of its key functions. Here is what I am trying to do:

  1. When the user clicks on the button to open the camera roll, tell whether the user allowed camera access or not.
  2. If the user didn't allow, show an alert to ask the user to turn on the permission from settings to ensure proper experience on the app.

Where should I look at to start tackling this? I am new to programming in general and not familiar at all with native code. I know this is a high-level question so some high-level guidance will be appreciated. Thanks!

Upvotes: 0

Views: 3666

Answers (1)

redberry
redberry

Reputation: 766

You can start at looking at react-native-permissions module. It allows you to ask for any kind of permissions that a mobile app can require, and also the dialogs are handled natively so you dont have to worry about building the alerts yourself.

https://github.com/zoontek/react-native-permissions

Here's an example on how to handle image selection with permissions

import ImagePicker, {
  ImagePickerOptions,
  ImagePickerResponse,
} from 'react-native-image-picker';
import { openSettings } from 'react-native-permissions';

import { alertWrapper } from './alert';

export const selectPicture = (options: ImagePickerOptions) => {
  const pickerPromise = new Promise<ImagePickerResponse>((resolve) => {
    try {
      ImagePicker.showImagePicker(options, (response: ImagePickerResponse) => {
        if (response.didCancel) {
          return;
        }

        if (response.error) {
          if (response.error.includes('permissions')) {
            alertWrapper('Error', response.error, [
              { text: 'Open Settings', onPress: () => openSettings() },
            ]);
          }

          return;
        }

        resolve(response);
      });
    } catch (e) {
      throw e;
    }
  });

  return pickerPromise;
  };

Upvotes: 1

Related Questions