之前用的是react-native-image-picker，但是當往服務器端傳的時候才發現，因為沒有圖片裁切，所以圖片過大，無法保存，所以只好更換成react-native-image-crop-picker。
react-native-image-crop-picker 不像 react-native-image-picker 直接就有彈出框，然后根據選擇跳入到相應的相機或相冊中，所以需要我們自定義彈出框，這里使用的是 modal。
react-native-image-crop-picker 的導入及配置這里就不說了，可以參考github上：
https://github.com/ivpusic/react-native-image-crop-picker
1、自定義彈出框（modal）
react native 提供的 Alert 局限性較大，沒有辦法自定義，所以我這里選擇用 Modal 來實現。
簡單了解：Modal組件可以用來覆蓋包含 react native 根視圖的原生視圖，在嵌入 react native 的混合應用中可以使用 modal，modal 可以使你應用中 RN 編寫的那部分內容覆蓋在原生視圖上顯示。
常見屬性：

visible // 是否可見  false／true
animationType  // 動畫  none：無／slide：從底部／fade:淡入淡出            
transparent = {true}  // 是否默認半透明
onRequestClose={()=> this.onRequestClose()}  // 彈出框關閉回調

<View >
    <Modal
       visible={this.state.modalVisible}
        animationType={'fade'}
        transparent = {true}
        onRequestClose={()=> this.onRequestClose()}
    >
        <View style={styles.alertBackground}>
            <View style={styles.alertBox}>
                <Text style={styles.modalTitle}>請選擇</Text>
                <TouchableHighlight underlayColor={'#F5F5F5'} onPress={this._openCamera}>
                    <Text style={styles.modalItem}>打開相機</Text>
                </TouchableHighlight>
                <TouchableHighlight underlayColor={'#F5F5F5'} onPress={this._openPicker}>
                    <Text style={styles.modalItem}>打開相冊</Text>
                </TouchableHighlight>
                <TouchableHighlight underlayColor={'#F5F5F5'} onPress={this._closeModal}>
                    <Text style={styles.modalItem}>取消</Text>
                </TouchableHighlight>
            </View>
        </View>
    </Modal>
</View>

用 state 中 modalVisible 的狀態來管理彈出框的顯示與關閉。
style樣式：

alertBackground:{
    flex:1,
    alignItems:'center',
    justifyContent:'center',
    backgroundColor:'rgba(0, 0, 0, 0.5)’,  // 如果要遮罩要顯示成半透明狀態，這里一定要設置，reba中的a控制透明度，取值在 0.0 ～ 1.0 范圍內。
},

alertBox: {
    width:200,
    height:175,
    backgroundColor:'white',
},

_openCamera： // 調用相機，這里就要用到 react-native-image-crop-picker 了，所以記得 import 它。
// 是一個異步加載，當正確是返回 image ，這里面就是我們需要的圖片信息。

ImagePicker.openCamera({
    width:300,
    height:400,
    cropping:true
}).then(image => {
    let source = {uri: image.path};

    this._fetchImage(image);

    this.setState({
        avatarSource: source  // 將圖片存于本地
    });
});

_openPicker： // 調用相冊

ImagePicker.openPicker({
    width:300,
    height:400,
    cropping: true
}).then(image => {
    let source = {uri: image.path};

    this._fetchImage(image);

    this.setState({
       avatarSource: source
    });
});

將圖片文件上傳：

_fetchImage(image) {
    let url = “http:。。。。。。。。”; // 接口地址
    let file = {uri: image.path, type: 'multipart/form-data', name:’image.png' } ; // file 中這三個元素缺一不可。 type 必須為 multipart/form-data。

    let formData = new FormData();
    formData.append('file', file); // 這里的 file 要與后臺名字對應。

    fetch(url,{
        method:'POST',
        headers:{
            'Content-Type':'multipart/form-data',
        },
        body:formData,
    }).then(function (response) {
        console.log("response",response);
        return response.json();
    })
}