Skip to content

Update the document on how to configure ImagePicker on IOS and Android without getting permission error #90

Closed
@laukaichung

Description

@laukaichung
  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

This feature could guide people on how to use ImagePicker without getting stuck or crashed on IOS and Android because of permission problems.

What does the proposed API look like?

Update the React Native ImagePicker section like this:

IOS Instructions:

Use Xcode to configure the following settings:

Make sure node_modules/react-native/Libraries/CameraRoll/RCTCameraRoll.xcodeproj has been imported to project libraries by following the libraries linking instructions. Don't forget to link the libRCTCamera.a into Link Binary with Binaries on your target's Build Phases. (Source: https://github.com/jeanpan/react-native-camera-roll-picker)

After iOS 10 you have to define and provide a usage description of all the system’s privacy-sensitive data accessed by your app in Info.plist. In the case of ImagePicker, you should go to the Info.plist panel,right click and add a row like this:

Key    :  Privacy - Photo Library Usage Description    
Value  :  $(PRODUCT_NAME) photo use (or anything you want to explain to the app user.)

Android Instructions:

In components that use ImagePicker, you should run a function to check the READ_EXTERNAL_STORAGE permission, preferably in the componentWillMount life cycle, for example:

export class ImagePickerWrapper extends React.Component {

    public render(){
        return <ImagePicker/>          
    }

    public async componentWillMount(){
        await requestReadExteralStorage();
    }
}

async function requestReadExteralStorage() {
    if (Platform.OS === 'android') {
        try {
            const granted = await PermissionsAndroid.request(
                PermissionsAndroid.PERMISSIONS.READ_EXTERNAL_STORAGE,
                {
                    'title': 'Permission To Load Photos From External Storage',
                    'message': 'Permissions have to be granted in order to list photos on your phones for you to choose.'
                }
            );

            if (granted === PermissionsAndroid.RESULTS.GRANTED) {

            } else {
                console.log("READ_EXTERNAL_STORAGE permission denied!")
            }
        } catch (err) {
            console.warn(err)
        }
    }
}

I wasn't familiar with the Native mobile development so I learnt from these permission issues the hard way. I hope the document update could save others' time and trouble.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @laukaichung

        Issue actions

          Update the document on how to configure ImagePicker on IOS and Android without getting permission error · Issue #90 · ant-design/ant-design-mobile-rn