Browse Source

last stable version - ImagePicker

master
analuizaff 4 years ago
parent
commit
ba54c24674
  1. 70
      src/app/components/ImageInput.js

70
src/app/components/ImageInput.js

@ -19,22 +19,34 @@ function ImageInput({ imageUri, onChangeImage }) {
requestPermission();
//requestPermissionCamera();
}, []);
const [modalVisible, setModalVisible] = useState(false);
const requestPermission = async () => {
const { granted } = await Permissions.askAsync(Permissions.CAMERA_ROLL);
if (!granted) alert("Você precisa habilitar permissão para acessar a biblioteca.");
};
const requestPermissionCamera = async () => {
/* const requestPermissionCamera = async () => {
const { granted } = await Permissions.askAsync(Permissions.CAMERA);
if(granted) {
launchCamera();
}
else if (!granted) alert("Você precisa habilitar permissão para acessar a câmera.");
};
const launchCamera = async () => {
setModalVisible(false);
try {
const result = await ImagePicker.launchCameraAsync({
allowsEditing: false,
});
if (!result.cancelled) onChangeImage(result.uri)
} catch (error) {
console.log("Erro ao ler imagem", error);
}
};*/
const requestPermission = async () => {
const { granted } = await ImagePicker.requestCameraRollPermissionsAsync();
if (!granted) alert("Você precisa habilitar permissão para acessar a biblioteca.");
};
const handlePress = () => {
if (!imageUri) setModalVisible(true);
if (!imageUri) launchImageLibrary();
else
Alert.alert("Deletar", "Deseja deletar esta imagem?", [
{ text: "Sim", onPress: () => onChangeImage(null) },
@ -43,7 +55,6 @@ function ImageInput({ imageUri, onChangeImage }) {
};
const launchImageLibrary = async () => {
setModalVisible(false);
try {
const result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.Images,
@ -55,19 +66,6 @@ function ImageInput({ imageUri, onChangeImage }) {
}
};
const launchCamera = async () => {
setModalVisible(false);
try {
const result = await ImagePicker.launchCameraAsync({
allowsEditing: false,
});
if (!result.cancelled) onChangeImage(result.uri)
} catch (error) {
console.log("Erro ao ler imagem", error);
}
};
return (
<View>
<TouchableWithoutFeedback onPress={handlePress}>
@ -82,36 +80,6 @@ function ImageInput({ imageUri, onChangeImage }) {
{imageUri && <Image source={{ uri: imageUri }} style={styles.image} />}
</View>
</TouchableWithoutFeedback>
<View >
<Modal style={styles.centeredView}
animationType="slide"
transparent={true}
visible={modalVisible}>
<TouchableWithoutFeedback onPress={() => {
setModalVisible(!setModalVisible);
}}>
<View style={styles.centeredView}>
<View style={styles.modalView}>
<View>
<Text style={styles.modalLabel}>Selecione uma imagem</Text>
<TouchableOpacity style={{ width: 300 }} onPress={requestPermissionCamera}>
<Text style={styles.modalText}>Câmera</Text>
</TouchableOpacity>
<TouchableOpacity style={{ width: 300 }} onPress={launchImageLibrary}>
<Text style={styles.modalText}>Galeria</Text>
</TouchableOpacity>
</View>
<TouchableOpacity style={{ width: 300 }} onPress={() => { setModalVisible(false) }}>
<Text style={{ fontWeight: 'bold', marginTop: 20, fontSize: 14, textAlign: 'center' }}>
Cancelar
</Text>
</TouchableOpacity>
</View>
</View>
</TouchableWithoutFeedback>
</Modal>
</View>
</View>
);
}

Loading…
Cancel
Save