Please provide the following:
- SDK Version: 41
- Platforms(Android/iOS/web/all): web
Whenever I select an image the response immediately says {cancelled: true}
import * as React from 'react';
import { View, Image, Platform } from 'react-native';
import { IconButton } from 'react-native-paper';
import * as ImagePicker from 'expo-image-picker';
import Layout from '../../constants/Layout';
const ImageUploader = props => {
React.useEffect(() => {
(async () => {
if (Platform.OS !== 'web') {
const { status } = await ImagePicker.requestMediaLibraryPermissionsAsync();
if (status !== 'granted') {
alert('Sorry, we need camera roll permissions to make this work!');
}
}
})();
}, [])
async function handlePickImage(){
// for gifs, quality must be 'undefined' and allowsEditiing 'false'
let pickerResult = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions[props.mediaType],
allowsEditing: props.allowsEditing,
quality: props.quality,
aspect: [4, 3],
base64: true,
allowsMultipleSelection: props.allowsMultipleSelection
});
console.log('pickerResult:', pickerResult);
if (!pickerResult.cancelled) {
let finalResult;
if (props.allowsMultipleSelection){
finalResult = await Promise.all(pickerResult.selected.map(async x => {
let uri = !x.uri.startsWith('data:') ? "data:;base64," + x.uri : x.uri;
let size = await _getImageSize(uri);
return {name: null, uri: uri, size: size, type: 'image'};
} ));
}else{
let uri = !pickerResult.uri.startsWith('data:') ? "data:;base64," + pickerResult.uri : pickerResult.uri;
let size = await _getImageSize(uri);
finalResult = {name: null, uri: uri, size: size, type: 'image'};
}
props.callback(finalResult);
}
}
return (
<IconButton
icon="camera"
size={props.size}
color={props.color}
onPress={() => handlePickImage()}
disabled={props.disabled}
/>
);
}
async function _getImageSize(uri){
return new Promise(resolve => {
Image.getSize(uri, (width, height) =>{
//console.log('width:', width);
//console.log('height:', height);
let imgWidth = width;
let imgAspectRatio = width / height;
let imgHeight = Math.round(imgWidth / imgAspectRatio);
resolve({width: imgWidth, height: imgHeight, aspectRatio: imgAspectRatio});
})
});
}
ImageUploader.defaultProps = {
size: Layout.iconLarge,
mediaType: 'Images',
allowsMultipleSelection: false,
allowsEditing: false,
quality: 1,
disabled: false
}
export default ImageUploader;