Camera component | Voters

Camera component

complete

Brent Vatne

ImagePicker API lets you take photos with the built in UI, BarCodeScanner lets you scan QR codes and other barcodes with camera, but many people need generic camera view that they can build their own UI around, and use to record video in addition to take photos.

May 9, 2017

Dipesh Koirala

I would like to draw some lines or Overlay to guide users to align the camera with the object in a certain way when taking pictures. I don't think I can achieve this with ImagePicker.launchCameraAsync. I don't think this issue got fixed yet?

Brent Vatne

marked this post as

complete

October 10, 2017

Brent Vatne

you can take photos and record videos with the Camera api now: https://docs.expo.io/versions/latest/sdk/camera.html

Alex Russell

Brent Vatne: Any idea about my comment from earlier today regarding picking videos from the device's library, though? I'm happy to submit as a new request if it is missing, I just don't want to do so if it

in but I just don't know how to do it.

Brent Vatne

Alex Russell: hey alex, you would need to 'roll your own' imagepicker ui and get the videos by using the CameraRoll api, CameraRoll.getPhotos (unfortunately named, should probably be named getMedia) lets you filter videos: https://facebook.github.io/react-native/docs/cameraroll.html

Alex Russell

Brent Vatne: Good point. So, just to check, there's no plan right now to create an

ImagePicker

-like thing for videos?

Alex Russell

Brent Vatne: Looking into this I can't see a way to do this without ejecting - using

CameraRoll.getPhotos()

the URIs returned are in the format

assets-library://asset/asset.MOV?id=[MEDIA_UUID]&ext=MOV

which Expo's FileSystem API won't use as a copy source or allow me to

readAsStringAsync

. Using a 3rd party library

react-native-mediapicker

has the same issue (the photos are in the

assets-library

format), and finally using the RN

ImagePickerIOS

allows me to select videos, and even does some kind of conversion for the application (including pparently copying it to the application's own storage area), but the URIs it generates are still not supported by Expo's

FileSystem

module:

file:///private/var/mobile/Containers/Data/Application/[APPLICATION_UUID]/tmp/[MEDIA_UUID].MOV

. As far as I can see, Expo's

FileSystem

can only handle Expo cache and document storage which are prefixed at

file:///var/mobile/Containers/Data/Application/[APPLICATION_UUID]/Library/Caches/ExponentExperienceData/[EXPO_APP_ID]/

and

file:///var/mobile/Containers/Data/Application/[APPLICATION_UUID]/Documents/ExponentExperienceData/[EXPO_APP_ID]/

respectively. The Expo

ImagePicker

component appears to create a copy of the selected image in the Expo cache storage, which means I can copy, move and read the file as I wish.

Brent Vatne

Alex Russell: thanks so much for the detailed info alex, I passed this on to nikki, who works on filesystem api. can you post about these filesystem limitations in the expo/expo github issues? https://github.com/expo/expo/issues

ZackLeonardo

Alex Russell: Me too. Expo.FileSystem.copyAsync method copy a video Asseturl to somewhere, only get an image.

ZackLeonardo

Brent Vatne: Video AssetUrl returned by CameraRoll.getPhotos() method can work well with Expo.Video but Expo.FileSystem not.

Alex Russell

I see that the live preview video recorder is now in and working in SDK 21. However, we now have

DocumentPicker

for general docs,

ImagePicker

for "camera roll" image picking, but I can't seem to find a way to have video picking from the "camera roll". Am I missing something or is that the last piece of this puzzle?

Adam Gilmore

This is great, but it would be fantastic to have the BarCodeScanner built into this new Camera component, similar to how react-native-camera works. Our use case is to scan a barcode and take a photo of the document which is currently two steps. Having that as a single screen would be fantastic.

Wei Zhang

I see this check-in, looks very promising, looking forward for sdk21 :)
Camera - video recording (#1002) - https://github.com/expo/expo/commit/4b4b44a53d32e13d6bbdeade71e3ecacaddbe0e4
Document: https://github.com/expo/expo-docs/blob/8dfaa440335ab2a70ce609b8c72d99246791598b/versions/unversioned/sdk/camera.md

Alex Russell

Wei Zhang: Oooh this is exciting!

Fadel Trivandi Dipantara

can you add options to takePictureAsync to request base64 string data of the image, because my API request only accept base64 instead of multipart data

Greg B

the camera example in documentation is broken.

Brent Vatne

Greg B: hi there! I believe we discussed this on twitter, and the problem was that it did not work on oneplus 5 phone. we found that oneplus phones aren't working so well with camera in some situations and are investigating

Greg B

Brent Vatne: yes! Sorry tried the forums before our Twitter chat. Thanks again for the help.

Alex Russell

Brent Vatne Just to make sure - this feature request

does

include being able to preview and record video with the

Camera

component, yes? (Because that's not in right now (that I can tell from the docs at least).) But it does not include anything relating to choosing existing images and videos from the "camera roll", etc., which is located in

ImagePicker

and should be (or is) a different feature request.

Correct?

Brent Vatne

Alex Russell: correct -- video recording is still in progress. ImagePicker is to use the system ui for camera roll (

launchImageLibraryAsync

), or to use the system chrome for the camera (

launchCameraAsync

)

Alex Russell

Brent Vatne: Excellent - video live preview + recording is the feature I am waiting on, so just checking that I am following the right request.

Lex Veritasov

Hey Brent Vatne will this include video picking from gallery?

Brent Vatne

Lex Veritasov: nope that is a separate thing

→