小菜鸟的第一篇文章，在学习RN，就当是做笔记吧，iOS开发RN中添加第三方库react-native-image-picker

才刚接触RN没几天，总是遇到一些小问题，比如现在所面临的添加照片和获取拍照权限的问题，从未写过博客，也不知道怎么弄，就当是做一次笔记吧，在做拍照的功能的时候，在中文网上看的资料，我使用的是react-native-image-picker，首先就是添加权限的问题，因为需要获取相册和相机的权限，么就开始了。

获取权限需要在Xcode里面添加，直接上图了

在这里添加Privacy - Camera Usage Description和Privacy - Photo Library Usage Description权限，很明显就知道哪个权限是做啥的。

接下来就是react-native run-ios了，当然首先还是要添加react-native-image-picker库是吧，npm install react-native-image-picker@latest --save命令就是添加库了，这里还需要做的就是手动去添加库，在Xcode中，直接上图吧，麻烦

当然，为啥我的手灰色的，因为我已经添加了。这个时候在终端使用react-native link react-native-image-picker命令，就link进了，

react-native run-ios 咦可以了。

小菜鸟的第一篇文章，在学习RN，就当是做笔记吧，iOS开发RN中添加第三方库react-native-image-picker

这是模拟器上获取相册选择的，至于拍照功能，因为iOS的模拟器不能实现拍照功能，所以只能真机测试，我这种小菜鸟上用

不上真机的。

下面是拍照部分的代码：

import ImagePicker from 'react-native-image-picker'

cameraAction() {
    ImagePicker.showImagePicker({
        title: '请选择',
        cancelButtonTitle: '取消',
        takePhotoButtonTitle: '拍照',
        chooseFromLibraryButtonTitle: '选择相册',
        maxWidth: 500,
        maxHeight: 500,
        quality: 0.75,
        allowsEditing: true,
        noData: false,
        storageOptions: {
            skipBackup: true
        }
    }, (response) => {
        if (response.didCancel) {
            return
        }
        else {
            let source = {uri: response.uri};
            this.setState({
                user_defined: true,
                imageUri: source
            });
        }
    })
}

{
    !this.state.user_defined ?

    <Image style={styles.image}
           source={require('../../../res/images/reg_head_img_nor.png')}
           resizeMode="cover">
        <TouchableOpacity onPress={this.cameraAction.bind(this)}>
        <Image source={require('../../../res/images/reg_carm_img_nor.png')}
               style={styles.takephoto}/></TouchableOpacity>
    </Image>
    : <Image source={this.state.imageUri} style={styles.showImage} resizeMode="cover">
    </Image>
}

	当然，代码中那些图片啥的就自己找了添加吧，懂的

第一篇博客，不知道会是啥样，我只知道我在成长，我也就一个刚毕业的小子而已，小菜鸟，在路上，学起飞，多多关

照！

小菜鸟的第一篇文章，在学习RN，就当是做笔记吧，iOS开发RN中添加第三方库react-native-image-picker

相关推荐