How to use expo-image-picker - 10 common examples

To help you get started, we’ve selected a few expo-image-picker examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github SCasarotto / casarotto-chat / src / pages / Main / Main.js View on Github external
.then((response) => {
				const { status, expires, permissions } = response
				if (status === 'granted') {
					ImagePicker.launchImageLibraryAsync({
						// mediaTypes: 'All',
						base64: true,
						quality: 1,
					})
						.then((response) => {
							if (!response.cancelled) {
								const { user, sendImage } = this.props
								//TODO: Check if it is a video and store video
								const data = { uri: response.uri, user }
								sendImage(data)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github SCasarotto / casarotto-chat / src / pages / Main / Main.js View on Github external
.then((response) => {
				const { status, expires, permissions } = response
				if (status === 'granted') {
					ImagePicker.launchCameraAsync({
						// mediaTypes: 'All',
						base64: true,
						quality: 1,
					})
						.then((response) => {
							if (!response.cancelled) {
								const { user, sendImage } = this.props
								//TODO: Check if it is a video and store video
								const data = { uri: response.uri, user }
								sendImage(data)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github bytefury / crater-mobile / src / components / FilePicker / index.js View on Github external
chooseFile = async () => {

        setTimeout(() => {
            this.onToggleLoading()
        }, 1000);

        const { mediaType = 'Images' } = this.props

        let result = await ImagePicker.launchImageLibraryAsync({
            mediaTypes: ImagePicker.MediaTypeOptions[mediaType],
            // mediaTypes: ImagePicker.MediaTypeOptions.All,
            allowsEditing: mediaType === 'Images' ? true : false,
            base64: true,
            quality: 1,
        });

        if (!result.cancelled) {
            const { onChangeCallback, input: { onChange } } = this.props
            this.setState({ image: result.uri });

            FileSystem.readAsStringAsync(result.uri, {
                encoding: FileSystem.EncodingType.Base64
            }).then((base64) => {
                const res = { ...result, base64 }
                onChangeCallback(res)
                this.onToggleLoading()
github amandeepmittal / mobilenet-tfjs-expo / App.js View on Github external
selectImage = async () => {
    try {
      let response = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.All,
        allowsEditing: true,
        aspect: [4, 3]
      })

      if (!response.cancelled) {
        const source = { uri: response.uri }
        this.setState({ image: source })
        this.classifyImage()
      }
    } catch (error) {
      console.log(error)
    }
  }
github SCasarotto / casarotto-chat / src / pages / Profile / Profile.js View on Github external
.then((response) => {
				const { status } = response
				if (status === 'granted') {
					ImagePicker.launchImageLibraryAsync({
						allowsEditing: true,
						aspect: [1, 1],
						base64: true,
						quality: 0.5,
					})
						.then((response) => {
							if (!response.cancelled) {
								this.props.uploadImage(response.uri)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github SCasarotto / casarotto-chat / src / pages / Setup / Setup.js View on Github external
.then((response) => {
				const { status, expires, permissions } = response
				if (status === 'granted') {
					ImagePicker.launchImageLibraryAsync({
						allowsEditing: true,
						aspect: [1, 1],
						quality: 0.5,
					})
						.then((response) => {
							console.log(response)
							if (!response.cancelled) {
								this.props.uploadImage(response.uri)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github sysgears / apollo-universal-starter-kit / modules / chat / client-react / containers / withImage.jsx View on Github external
pickImage = async ({ onSend }) => {
      const { t } = this.props;
      if (await this.checkPermission(Permissions.CAMERA_ROLL, 'android')) {
        const { cancelled, uri } = await ImagePicker.launchImageLibraryAsync(settings.chat.image.imagePicker);
        if (!cancelled) {
          const { size } = await FileSystem.getInfoAsync(uri);
          const reg = /[^\\/]*\.\w+$/;
          if (size <= settings.chat.image.maxSize && reg.test(uri)) {
            const type = mime.lookup(uri);
            const name = uri.match(reg)[0];
            const imageData = new ReactNativeFile({ uri, type, name });
            onSend({ attachment: imageData });
          } else {
            this.setState({ notify: t('attachment.errorMsg') });
          }
        }
      } else {
        this.setState({ notify: t('permission.errorMsg') });
      }
    };
github SCasarotto / casarotto-chat / src / pages / Setup / Setup.js View on Github external
.then((response) => {
				const { status, expires, permissions } = response
				if (status === 'granted') {
					ImagePicker.launchCameraAsync({
						allowsEditing: true,
						aspect: [1, 1],
						base64: true,
						quality: 0.5,
					})
						.then((response) => {
							if (!response.cancelled) {
								this.props.uploadImage(response.uri)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github SCasarotto / casarotto-chat / src / pages / Profile / Profile.js View on Github external
.then((response) => {
				const { status } = response
				if (status === 'granted') {
					ImagePicker.launchCameraAsync({
						allowsEditing: true,
						aspect: [1, 1],
						base64: true,
						quality: 0.5,
					})
						.then((response) => {
							if (!response.cancelled) {
								this.props.uploadImage(response.uri)
							}
						})
						.catch((error) => console.log(error))
				}
			})
			.catch((error) => console.log(error))
github expo / expo / home / utils / ImageSelectionUtils.ts View on Github external
import * as ImagePicker from 'expo-image-picker';
import * as FileSystem from 'expo-file-system';
import * as MediaLibrary from 'expo-media-library';
import * as Permissions from 'expo-permissions';

const mediaOptions = {
  allowsEditing: true,
  quality: 1.0,
  allowsMultipleSelection: false,
  mediaTypes: ImagePicker.MediaTypeOptions.Images,
  exif: false,
  base64: false,
};

const directory = `${FileSystem.documentDirectory}/photos`;

async function ensurePermissionsAsync(): Promise<boolean> {
  const { status } = await Permissions.askAsync(Permissions.CAMERA, Permissions.CAMERA_ROLL);
  if (status !== Permissions.PermissionStatus.GRANTED) {
    alert(
      'Cannot select a banner photo without media access! Please enable the "Camera" & "Camera Roll" permission in your system settings.'
    );
    return false;
  }
  return true;
}

expo-image-picker

Provides access to the system's UI for selecting images and videos from the phone's library or taking a photo with the camera.

MIT
Latest version published 16 days ago

Package Health Score

92 / 100
Full package analysis