expo-image-picker

Learn gallery access with expo-image-picker.

The expo-image-picker package

To let the user pick an image from the gallery or take a photo with the camera you use the expo-image-picker package. This package offers two functions for both gallery and camera selection: launchImageLibraryAsync and launchCameraAsync. With Expo you install it with npx expo install expo-image-picker.

The package opens its own selection interface; the user picks an image or takes a photo. The result returns as an object; the assets field of this object carries the picked images. The canceled field tells whether the user canceled the selection. This package is the easiest way to access both camera and gallery through a single interface.

Import

The package is imported from expo-image-picker as a * namespace. The common syntax: import * as ImagePicker from 'expo-image-picker'. This pattern groups all functions of the package under the ImagePicker name; it makes the code easier to read.

After importing you can use two main functions: ImagePicker.launchImageLibraryAsync (gallery selection) and ImagePicker.launchCameraAsync (camera capture). You also request gallery permission with ImagePicker.requestMediaLibraryPermissionsAsync. All functions of the package are asynchronous so they are awaited.

Exercise Import the package

Complete the empty file. Import the expo-image-picker package with import * as ImagePicker. Then export it with export { ImagePicker }.

Show example solution

import * as ImagePicker from 'expo-image-picker';

export { ImagePicker };

Test yourself

What does expo-image-picker provide?
- Only location info
- Only file download
- Gallery and camera selection
- Only network requests
Show answer

Gallery and camera selection — The package provides gallery and camera selection.

Write the import statement

import * as ____ from 'expo-image-picker';

Show answer

import * as ImagePicker from 'expo-image-picker';

Match each part to its role

launchImageLibraryAsync

Picks from gallery
launchCameraAsync

Captures with camera
requestMediaLibraryPermissionsAsync

Gallery permission
assets

Picked images

Next lesson: Gallery permission

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies