React Native Image Picker Tutorial | Pick from Camera, Gallery | Crop Photo

Подписаться 42 тыс.

Просмотров 122 тыс.

50% 1

In this tutorial, you'll learn how to pick an image from the photo gallery or from the camera for a react native app. To implement this feature I have used react native image crop picker package, by using this package you can easily crop the while selecting from the camera or library.
Food Finder App Tutorial Playlist • Food Finder App in Rea...
React navigation v5 tutorial playlist • React Navigation 5 Tut...
GitHub Repo URL bit.ly/2MkzWhB
The react native image crop picker package URL github.com/ivpusic/react-nati...
If you found my tutorials helpful, you can buy me a coffee from this link paypal.me/itzpradip
Follow me on GitHub github.com/itzpradip
Subscribe to my Channel bit.ly/2PaUqOk
For more tutorials on WordPress, React JS, React Native and Digital Marketing visit: www.pradipdebnath.com/blog/

Опубликовано:

8 июл 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 141

@afraaalobaid8256 2 года назад

Underrated channel, very clear and non-lengthy explanation step by step. Thank you very much for taking the time to make such content free.

@ajith1vrg 3 года назад

Your tutorials are precise and worth spending time on it. Keep up the good work. Thanks

@philipphahmann5971 3 года назад

I really like your tutorials, its very good!! It helps me a LOT !!!

@tenorgames 3 года назад

Love this! Concise and valuable.

@pranavkul525 2 года назад

You are doing a wonderful work! Keep it up!

@DineshKumar-mc6od 4 года назад

Your tutorial is straight to the point, Love it

@itzpradip 4 года назад

Glad you liked it!

@ranjankumarsahu589 4 года назад

Thank you so much for such useful content.

@felipemelendez5741 Год назад

Thank you, you're an excellent instructor =)

@adityabhandari6688 2 года назад

good job! loved this tutorial!

@Dark23144 4 года назад

I liked it before watching 🥰

@patcheslapp660 3 года назад

you save my life dude thanks a lot

@soudouglas 2 года назад

Very nice! Thanks for the video

@osamagamal495 4 года назад

You're doing great job man.

@itzpradip 4 года назад

Thanks, you too!

@flykeymikey4106 4 года назад

AMAZING TUTORIAL, I LOVE THIS GUY!! ;) GOD BLESS!

@itzpradip 4 года назад

Glad it helped!

@malikali3426 3 года назад

Sir i am getting an error in image picker.Kindly help TypeError: null is not an object (evaluating '_reactNativeImageCropPicker.default.openCamera')

@bikramkarmakar6482 3 года назад

@@malikali3426 Same Problame

@0007Javascript 2 года назад

very Helpful content Thanks

@obentabiayuk4780 4 года назад

I Liked it even before watching. Thank you for this... Please keep up

@itzpradip 4 года назад

So nice of you

@malikali3426 3 года назад

Sir i am getting an error in image picker.Kindly help TypeError: null is not an object (evaluating '_reactNativeImageCropPicker.default.openCamera')

@vijaysahani7343 3 года назад

Awesome work did..!!.

@millwoodfurnace2739 2 года назад

Great! It worked!!!!

@edimarfsatumbo5675 3 года назад

Thank you so much

@shebeeradimaly6125 Год назад

thanks ..bro ...very helpful

@sandeshbirwadkar2384 4 года назад

Great tutorials!

@itzpradip 4 года назад

Glad you like them!

@daniyal_khannn 3 года назад

Thanks alot bro !!!!!!!

@rhuzaifa 3 года назад

Love your tuts. I wanted to ask is this package updated or is maintained?

@deepanshmakkar5118 4 года назад

Thanks a lot Sir you are always a life-saver

@itzpradip 4 года назад

Happy to help

@shubhasismahata4726 3 года назад

You are great sir

@SACKO0731 Год назад

@Pradip Debnath, how to do you save that image in a local storage so next time refreshing or loading it'll just be there?

@andrewndotela7407 2 года назад

Okey smart kid, you have my vote

@upospos 3 года назад

thank you. very much

@immanueldiaz5710 4 года назад

Amazing man!!

@itzpradip 4 года назад

Thanks!!

@qasimmughal3966 4 года назад

this boy have awesome videos , keep it up

@itzpradip 4 года назад

Thank you, I will

@zillboy 3 года назад

Thanks 🎉😊🙋🏻‍♂️

@mohamedyoussef8835 2 года назад

Awesome Explanation ++++++++++++++++++++++++++ Thank you

@ahmedalsawy7756 3 года назад

Thank you bro

@ibrasonko3907 3 года назад

thanks are awesome ..!

@ranjankumarsahu589 4 года назад

Thanks Pradip Sir, I need a functionality to upload image and some text to server, but if there is no internet connection store this data to local and upload it when internet active. Can you please help me with this. I am new to React... Following your tutorials to learn .

@syrian167 3 года назад

thank you a lot

@RavindraKumar-mn4jk 4 года назад

Asset images are not showing sometime when we reopen application. I had used require statement as per the React Native documentation. After clear data we show those images .Can you suggest me how to load these asset images so I can handle this issue.

@oguzhan2393 3 года назад

thanks. But I couldn't find how can I add variable inside ImageBackground "require". It does not allow to add varible inside require(image). Not from uri from .png

@nmrtns 4 года назад

Great tutorial. Does this work for expo?

@antonitescaro2728 4 года назад

I'm trying to implement this on the avatar picture on the drawer content but the bottom sheet is transparent so you can click the buttons behind and also the width only takes the size of the drawer, not the full width of the screen... anyone to help out a noob?

@nileshnilu7902 2 года назад

Superb😊😊😊

@ahava884 3 года назад

Can I do this function in expo ?

@faridrabahi6740 Год назад

does react native image crop picker package works with expo project?

@felixmilome Год назад

Does this work on Expo

@arjungoalset8442 4 года назад

Thanks for such great content. Just curious, when are you dropping the next tutorial? Looking forward to it.

@coltonhugh7208 3 года назад

i know Im pretty off topic but do anyone know of a good website to watch new movies online?

@santiagoedwin7343 3 года назад

@Colton Hugh Flixportal :)

@coltonhugh7208 3 года назад

@Santiago Edwin Thanks, I went there and it seems like a nice service :) I really appreciate it!!

@santiagoedwin7343 3 года назад

@Colton Hugh no problem :)

@RowdyCoders 3 года назад

I am building Contacts app with the photo, name, phone number of the contact...does this video work for uploading contacts photo and display this photo Avatar in my contacts list...?

@brianhall510 3 года назад

Hi, do you have to add the string keys if youre already coding for an ios app in VScode? I dont have a folder for those to go in

@kartikguleria465 2 года назад

Go to ios folder and then info.plist or go to xcode and then add it in info.plist file

@sachindobal3273 3 года назад

Hey can you provide the authentication credentials so we can have a look it on local Thanks

@jogre900 3 года назад

it work with expo?

@pratikgadge6388 3 года назад

sir when reload this from node bundler then it's showing previous img which is seted in useState

@ammarahsiddiqua 3 года назад

Is there a property to turn on flash in the camera

@testuser6773 4 года назад

in samsung s8 the image is showing as mirror image after picking it from camera. any solution?

@iliyalyan8937 3 года назад

how to send it with axios tho? thanks!

@sunilkumarmaurya4562 2 года назад

can u plz add functionality when user click don't allow(permission)..

@surendrawagle1896 3 года назад

Hello Pradip, Can you please make a video on react native audio player, video player, video chat etc ?

@jksj7325 3 года назад

I could not run pod install because I'm using vscode on Window. Besides, Im using Expo

@ashishsharma9000 3 года назад

did you fix the issue in android 10?, app crash after click it try this in redmi phone

@juridiener9790 3 года назад

Hey Pradip, you have really cool tutorials i woul say on of the best, because ist show the common Problems and solutions if you are build an app. I have a question in my Project there are no folders like ios and android? I started my project with expo. Can you help me out

@NewToneMusicOfficial 2 года назад

did you find the solution?

@juridiener5942 2 года назад

@@NewToneMusicOfficial unfortunately no

@kamleshprajapati6621 4 года назад

How to store image in specific folder using image picker? Please make video..🙏🙏🇮🇳

@jamalwebdevelopment4841 2 года назад

hello sir, because of image picker my app in being crashed by android OS after taking picture, it has android version greater than 10. Do you know how to solve this crashing issue.

@pavaneswar8071 3 года назад

Sir iam getting error when I insert react-native-crop-image-picker

@ouattarasiaka8532 4 года назад

Good goooooooooooooooood

@tuann2507 4 года назад

thank you, Hope next video will show how to update drawer image when new profile avatar uploaded

@itzpradip 4 года назад

you can do that by using context api & useReducer hook of react native to implement global state. Check my authentication tutorial in react navigation 5 tutorial series

@tuann2507 4 года назад

@@itzpradip cheers. I'll have a look abt that

@MouaQ44 4 года назад

Great tutorial. Please could you create SignUpScreen With firebase and display data in profileScreen on react native.

@itzpradip 4 года назад

Thanks for your suggestion. Definitely I'll try to do it in future.

@sulemanali8542 4 года назад

nice video make more videos on react native

@itzpradip 4 года назад

Sure I will

@kuldipmakwana2173 4 года назад

What if we install react using expo, in that this folders are not there

@Mayanksingh-qp6dy 3 года назад

Eject from expo

@antonitescaro2728 4 года назад

if I try to do this: bs = React.createRef(); fall = new Animated.Value(1); I get errors saying the variables doesn't exist, and if I put "const" before it works but I have to change the syntax to not use the "this", but if I do that I get a bunch of unhandled promises =(

@nationgreat 3 года назад

Yeah i get same issue

@AnnieShark 2 года назад

can anyone tell me how to view complete source code of this video from github?

@simonyanky2528 3 года назад

can u plz make a video on how to save it cloudinary then save the link to mongodb?itz not working.

@muhammadjunaidbashir8873 2 года назад

Hi bro, on my android device nothing works, I mean camera is not working and gallery is not opening , even I have allowed all permissions from system, No error but nothing happens.

@zaidmohammad3826 3 года назад

Great explanation... I cant build my app on ios after installing this package. It works perfectly fine on android. Any suggestions?

@kartikguleria465 2 года назад

pod install

@atakanpasal4436 Год назад

You said your upcoming tutorials will be about storing data but I cannot find it :((

@valdeirchaves7600 4 года назад

Helloo, how are you? I like your tutorial very much. But I'm having a problem in android, when I choose a photo or take from the camera my app restarts, what I can do? Thanks!!!

@valdeirchaves7600 4 года назад

someone to help-me?

@bandararo285 2 года назад

this turorial only for android mobile?. but react native support both ios andf android. so why can't you develop for both os?

@premdasv8 4 года назад

Can you do a video on using Context API & Hooks Also Some local DB, like Realm or Watermelon.?

@itzpradip 4 года назад

Thanks for your suggestion. I'll try

@rahulmore9648 4 года назад

Sir... Can you authenticate Sign Signup using firebase!! Great Tutorial..

@itzpradip 4 года назад

will do that soon

@adityakaveri9810 3 года назад

Sir , your videos are very useful to us in our project. Thanks . I have an error. My application runs properly for the first time.....but for second time it gives me error "TypeError: undefined is not an object (evaluating '_this.bs')" ....Sir, how to solve this error ...plz help me

@riyah8513 3 года назад

Did you solved this issue?do u have a solution?

@MrOwenjames24 2 года назад

I have the same error did you ever resolve this?

@malikali3426 3 года назад

Sir i am getting an error in image picker.Kindly help TypeError: null is not an object (evaluating '_reactNativeImageCropPicker.default.openCamera')

@lionelrynjah8021 3 года назад

Same here buddy , have you found a solution? Please help me too.

@kartikguleria465 2 года назад

@@lionelrynjah8021 did you got the solution

@MrOwenjames24 2 года назад

@@kartikguleria465 have you found a solution?

@heypbolon1941 3 года назад

I cant do pod install, im on windows what should i do?

@Mayanksingh-qp6dy 3 года назад

U need a mac

@vinodhm8452 3 года назад

waiting for the next tutorial....

@itzpradip 3 года назад

Check the playlist many videos are already added to this playlist after this video.

@vinodhm8452 3 года назад

Thanks for replying to my comment , At the end of the video u mentioned that in future videos ur trying to upload the image to server ,is any there any tutorial related to that ,if there please share the link. I tried to send base64 image data to server but it get error , or some other ways?

@tushar09nov 3 года назад

TypeError: null is not an object (evaluating '_reactNativeImageCropPicker.default.openPicker') getting this error what to do?

@jaychaturvedi7433 3 года назад

i'm also facing same problem bro @Pradip sir help

@fearguspowers238 3 года назад

same as me

@riyah8513 3 года назад

TypeError: null is not an object (evaluating '_reactNative Image Crop Picker.default.openPicker')#ip=1 I am getting this error.when clicking button that opens camera.. How to solve.please help

@jaychaturvedi7433 3 года назад

found any solution bro then please share

@riyah8513 3 года назад

@@jaychaturvedi7433 changed the Gradle version.it works fine now

@tommydannybruv 3 года назад

Will this work for expo?

@safeerahmadsafeerahmad5847 3 года назад

expo has its own image picker

@muhammadusman4593 3 года назад

hi everyone, I need some help. Can anyone familiar with react-native cli camera / image picker. I just need to access my camera and take both front and back images at the same time. It's urgent I just want to clear my university project where the requirement is this one.

@ibadurrehman4561 4 года назад

TypeError: null is not an object (evaluating '_reactNativeImageCropPicker.default.openPicker') error solution plz

@decordelights_ 3 года назад

its so annoying I got it too

@chisomoguibe8467 3 года назад

Same for me and no solutions online seem to work...I get a similar error with expo's ImagePicker package too :(

@riyah8513 3 года назад

Need solution for this.any body solved this issue?

@virinchimsk83 3 года назад

Bro..I have cloned your project it is asking.. username ,password could you please share that..it will be helpful..thanks in advance:)

@ngotrongphuc99 3 года назад

i got an errror Cannot read property 'openPicker' of undefined,i'm sure that i've completed all the setup guide

@prathamvaghela99 9 месяцев назад

I got the same error in my expo app did you find any solution pls share

@ajmalhasan9759 4 года назад

Kindly make tutorial on sqlite and redux saga...

@itzpradip 4 года назад

thanks for your suggestion

@jesusochoa6616 3 года назад

Guys if you are getting an error after install the package react-native-image-crop-picker , after you configure like the video have to change your (android/build.gradle) classpath 'com.android.tools.build:gradle:4.0.1'

@yeilmusic 3 года назад

use react native jjkit . Photokit

@shingoitech3160 2 года назад

TypeError: null is not an object (evaluating 'ImageCropPicker.openPicker') TypeError: undefined is not an object (evaluating '_$$_REQUIRE(_dependencyMap[2], "react-native-image-crop-picker").ImagePicker')

@kartikguleria465 2 года назад

same, did you find the solution ?