Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server

Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server - Hello friends Android tutorial and tips trik, The article you are reading this time with the title Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server, we have prepared this article for you to read and download the information therein. hopefully fill posts article -, article (Part, article 4.1), article android, article How, article Images, article Multiple, article Server, article TO, article Tutorial, article Upload, article Volley, we can write this you understand. Well, happy reading.

Title : Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server
link : Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server

Baca juga


Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server

Hello everyone, my name is Oum Saokosal.

This is the part four of how to connect androidwith PHP and MySQL using Volley.

You can find me on YouTube, Facebook, Twitterand github.

In this video particularly, I will use oneof my library in the github.

In part one, I talked about how to setup avolley library.

Part two, how to send and read data from andto PHP and MySQL.

Part 3, I talked about how to get JSON dataand put into the custom listview.

In this part 4.

1, I will talk of how to sendimages to server, so there are lots of things to be aware of.

First, you have to know how to load imagefrom the gallery and this one I really use one from my library, PhotoUtil.

There are many steps, first one you need toknow how to open a gallery and get an image path and load the image and lastly, you haveto encode it to base64.

The reason that we have to encode is becausewe cannot send the physical image file to the server instead we have to send data afterstring, so Base64 is the good choice and we can convert anything not just image but avideo, a file or any file you know, and the PHP or maybe your webserver will get a dataand then convert it into a physical file and backend.

And then I will take you to where to uploadthe image to server at once and lastly you will know how to write the PHP code and getthe image and upload it because there are many things to be covered, so I decided tomake two video of this, what I call 4.

1 and 4.

2, so in this video I will talk about thefirst bit, the loading bit, actually it is very complicated.

Let’s go to our project, this is the previousone that we could log in from the database, this one we get the data from PHP, so makesure that you have the XAMPP or WAMP installed and this is the database and in here the customer, tbi_user and whenyou log in correctly, you go to the SubActivity here and you use the volley again to readthe data and then action for the JSON.

The JSON file is in the product cat and soall the data here will convert to the JSON.

So this is the JSON and redirect all JSONto the android.

Okay? That is in the previous video, so if you wantto know more about this, make sure you go to my YouTube channel, okay and you can findthe videos about volley and if you want to find more about android, here is a good placeto find them, okay? So let go to our project, because this projectparticularly is about the upload image is very different from the previous one, so Ihave to create another, because I don’t want to mess around with this because we havea good code here already, so let’s create the project from scratch.

Recall android volley upload images, thenyou use the four basic here, okay! This is the project, nothing else but justa blank page, so before anything else I have to show that I am using android 2.

0.

For the time being maybe you use a betterversion than that or maybe older version so make sure that you update the latest one,and this is the gradle, the library there and nothing change much except that you have3 folders here, in the previous android like 1.

5 you have only two but now, you have 3folders and it is about testing the two but we don’t need that we just need the mainactivity like usual.

So we go here and then I want to have a buttonto open a gallery, so let’s grab the imageview here, so let’s go to the code, and hereandroid and you can have a preview here and so you want to get image from the android,so you have to call the app android and you can maybe gallery here.

Can we have that? It’s not good maybe this one? It’s a nice one and maybe you wanna havea size a little bit bigger, let’s try this, okay that’s good, this is good enough.

And maybe you need another button for uploading,okay, so copy and paste maybe around here okay, and go back here, here I wanna use theupload.

So.

Upload_you_tube, yes, yes that is enough andgo back and change the image and double click on that, you can change the Id and I willcall the gallery and this one is ivupload okay, so click on that you will open galleryand click on this , you will upload.

Okay? So get all the image to the main activityand I don’t need the menu, so just do this ImagegView ivGallery, ivUpload; so ivGallery= (ImageView) findViewById (R.

Id.

IvGallery) and the same to upload here.

So, here ivGallery.

SetOnClickListener (new)underscore space and now you have an event for the gallery.

Okay, so when you click on that you can openthe gallery.

The code for opening the gallery is very complicatedthat why I have to create one for myself, so you go to the browser and type github.

Com/kosalgeek/like this and you will find something like, you go to repo here and PhotoUtil on the tophere, okay, so just hit the download zip here, unzip it, so what you need is this zip fileand you can read the tutorial here, okay some help here, you need some information on camera,you want to use the camera, if you don’t maybe you just use the photogallery, if I,you want to know it for in detail, I have a another video, but I use the post asynctaskis fine because in that video I focus on the camera and the photo from gallery, you goto my YouTube channel and you go to advanced here and you will see here android uploadimage to server and this one is the path of that.

So go to your project and click here and yougo to project and click here and go to project perspectiveappslbsright click and test it,okay, right click again and ask the library, okay, so it take some time to see it on thejar file, it’s good to go, you should go back to android here and you can go to gradle the second one, you can see that and now add twodependencies already, so you are good to go.

So to open the gallery, there are two things,first one you need to call the gallery to open the gallery intent and start the intentfor result, okay.

So intent here, you want to go to anotherproject, okay but also intent you can start it and you can get the result back.

This is what you will use it here.

And you need to override the method calledonActivityResult () and then here you can grab the picture from there.

Okay.

So let’s go here, first you need to be declaregalleryPhoto and you can call galleryPhoto and maybe before that galleryPhoto=new GalleryPhotoand you need to provide a context here.

Okay, that’s it.

Now you can use that galleryPhoto.

OpenGalleryIntent() and then here you can assign to intent, okay and then you can startActivityForResult() and then put the intent here and then you need a request code here.

Request code is very important because itis used to make a condition that when you called it and you let’s say you call numberone from here and then in another method you should have the same number.

Okay, so usually people just declare it asa final integer.

So I would do is like this and maybe justfour digit is enough, so I just do something like this, okay, like this is fine, and galleryrequest here but before you try it, you have to put a permission, actually the permissionis not required in the older version, but in the next version, the newest version, thepermission will be required for the reading, so you have to use this permission and thenread and execute.

Here android.

Permission.

READ_EXTERNAL_STORAGEand this one will be required in the future, so make sure you have this.

Okay, so let’s start it.

Let’s read it, you see now you have theimage at the gallery open for you already, now you can choose the image and this is fromthe previous project if you want to upload your image to that, you just go to this one,this button, android device monitor, looks like the android icon here, yes, okay? Make sure that you are running emulator hereand click on this, and you go here, you will see a SD card, okay, grab any image you want,so now I have some images and the image file doesn’t have to be like this, you can havea space, you can have a capital letter, you can have a you know underscore and whateveryou want is the real image, it doesn’t care like the image.

Like in drawable here the image is very strictbut for the usual image it doesn’t matter, it can be anything.

So go there and here you see the icon here,this one is push a file onto the device or maybe a file, and this one you got a save,so let’s push it one by one, so my project is here and customer img, so 1,2,3,4, letsupload the file, you have it close it and reopen like refresh, so now let start it fromscratch, so in android studio 2.

0 usually the project is cached to the emulator, soyou want to refresh the project, I recommend you go to build, and clean it before you rerunit, it takes so much time here, but for a simple chain you will see the difference,like a little bit different, for that reason android cast the project for you but sometimesyou will see the you know the previous code and previous project doesn’t change so makesure you clean it.

Now let’s open it from the genymotion again,okay lets go and click it again, so let’s go to maybe file manager first, now you cansee the image that we first uploaded and gallery thing should go down a little bit, there yougo and here is the image.

When you click it nothing happened becauseyou don’t receive it here, so to receive the image, you have to override a method,so you have to go outside here and onActivityResult() sometimes in your android video, the IDE doesn’tsuggest you the method like that, may be you are using the old one, so it okay , you cango to code and go to override method here, may be you can put the A to Z like this andI think you can find it inside here onActivityResult() okay? The.

Android.

Support.

V4.

okay? It is the same thing.

Okay? And here now you have two things: the resultcode and the request code.

So here you remember when you say startActivityForResult(), you have intent and request code, so the request code and result code is the okay thing.

So first we have to check with the resultcode, if (requestCode=RESULT_OK), this one is from the android library, okay? Like this and then you can say that if nowit is not the request, it is the resultCode.

If the (requestCode == here the request codeis the gallery result that we just created it and something like here, then you can grabthe data and then here galleryPhoto okay and then you can get the path, before that youhave to set the PhotoUri and in the PhotoUri you get the data getData () and now you canget the path.

And this is the path that we just selected.

So let’s log it and so let’s create aTAG string and TAG is this.

GetClass ().

GetSimpleName ();Okay let’s choose a file, this is the recent one, see that, this is the path okay? Actually, the code here is easy but the realcode is very complicated, the reason is that it is very difficult because the path thatyou get is different from the API version because the API 11 below is different from11 to 18 and the github 19 is different so you don’t have to write your code now, soyou can just use mine, okay now you get the image, so you wanna put the image somewherein the layout, so maybe lets create an image, but I want to add the image view to this layout,programmatically not from manually, I want to create from here, so because image maybe have more than one ,so I would like to have a scroll view, so that you can scrolldown.

So let’s create a scroll view here now,maybe here and now change the width here to match parent and height to match parent, okay? That’s enough and inside the scroll view,I want to have a linear vertical one, so grab and pass it like this, so the vertical onenow is fine, now looks good, okay, now you have the scroll view outside the linear, sojust change the name, so maybe zoom in a little bit.

I want to change the linear, so we just don’tneed to catch this, so the scroll view is a manual one.

So I will call LinearMain something like that,and that’s okay, so any time you open an image, you will put it into the linear name.

So go here and now you have to grab the linearlyoutside so LinearLayout linearMain and over here LinearMain = (LinearLayout) findViewById(R.

Id.

LinearMain); okay, that’s enough, now this one is the path and you want to loadthe image from there, to load that, you will use one of my library again.

So here the image loader but the image loadername may conflict with the volley one because the volley has an image loader as well.

So, I decided to create an alias called PhotoLoaderand this alias is the same thing but different name, okay, you are free to use imageloaderor photoloader.

It is up to you and then you need to callfrom the gallery one and maybe it is better to declare a string and maybe I call StringphotoPath here and it is photoPath and you need to request a size because you cannotload the whole image you gonna have out of memory exception, so you have to make surethe size you want to request is enough to fit the screen here, usually I use (512 by512) and the size not exactly like its gonna be (512 by 512) it just a request file andit will scale based on you requested.

Okay and then you can get the bitmap here,declare a bitmap here and you need to surround it by try-catch here because the image maynot be found here.

And then we have a nice code here and getcontext here and say “Error while loading image”, and show the text.

Now you get the bitmap here and you want topass it to the Imageview.

So let’s create an Imageview, So the Imageviewhere is not from the content, and it is the new one that we created anytime that you gonnaclick the photo from the gallery, so ImageView = new ImageView and here you getApplicationContext(); So imageview need two things, you need view actually and you need the layout widthand the height and this one without this is gonna be an error.

So to get that you need linear, so you canset it by setLayoutParams (); and so that’s why you need the LayoutParams () and you needfrom the LinearLayout here and may be you call it LayoutParams and new LinearLayout.

LayoutParams () and now you need to set theheight so LayoutParam.

MATCH_PARENT and may be WRAP_CONTENT or whatever you want.

So let’s say you want to put the MATCH_PARENTand the other one is the MATCH_PARENT again.

So you need something like this and put theLinearLayout Params inside the image here and so that code is a bit longer here andthe image may be you want to set a scale like setScaleType and scale type is usually tofit center here and imageView as setPadding (0, 0, 0, 10), 10 is the button which is left,top and right button.

Okay and setAdjustViewBounds (true);Now you get an image any time you click on the image from the gallery here and you wantto add to the linear layout, so linearMain.

AddView (imageView) okay? I forgot this one, ImageView, you have toset this one imageView.

SetImageBitmap (), this one is just an image and you don’t wantto get the bitmap but for here it is the bitmap.

So, this is very important, so get the bitmapfrom here and set it to the image and the image set to the layout.

So, let’s try it from the clean one and grab an image, let’s try this one first, see that nicely, and maybe the one with aspace, you see that, maybe grab from this one and from the gallery.

It not that good because it is from the emulatorand camera just for the catch thing but try it.

Okay now its ok and may be scroll down a littlebit, okay with this one this nicely, so know you have four images and you have to put itinto an array and you have to be ready to upload and so anytime that you click on thatyou put into an array and maybe for yourself maybe you have to have like a close buttonsomewhere around here but you can delete that but I suggest that if you want to use thebutton like that maybe you should use the list view and not a simple code like this.

So in the list view, you can have a deletebutton and then re-upload it but this is for the simple one, this is enough, so that’sit for the 4.

1 video and if you like it please don’t forget to subscribe to my channeland I will see you in the next video.

Thank you!.



Thus Article Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server

That article Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server This time, hopefully we can give you all of the benefits. Well, I'll see you in another article post.

You now read the article Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server the link address http://svedda79.blogspot.com/2016/05/android-volley-tutorial-part-41-how-to.html

0 Response to "Android Volley Tutorial (Part 4.1) - How to Upload Multiple Images to Server"

Post a Comment