— Before start reading this article, this solution has been deprecated, so please read this article with a new solution by XamBoy , Thanks 🙂 —
It is very common nowadays to select images from the photo gallery in a mobile app. Right now there is a plugin on Xamarin Forms called Media Plugin https://github.com/jamesmontemagno/MediaPlugin where you can select an image from gallery or camera. Unfortunately, if you want to select multiple images there aren’t a lot of open source options to do so.
Here I will guide you through an implementation I did to Select Multiple images from the photo gallery in Xamarin Forms, using a dependency service. In the case of iOS it was easier because right now there is a component to do it https://components.xamarin.com/view/elcimagepicker so, I just had to do an implementation to use it in Xamarin Forms.
Here is my code:
I started by creating an interface for the dependency service to open the gallery on a PCL Xamarin Forms project:
After we implement it on iOS and Android will be able to use it this way:
Android Implementation:Â
Then in the Android project, I created a service to handle the photo gallery opening, also I’m using the Permission plugin for check and request permissions in Android > 6
Is important to remember adding the permissions in the Android Manifest:
The images selected are sent to the OnActivityResult method on the MainActivity, I also added an extra implementation for rotating the images, because depending on the orientation in which it was taken, will get it in that orientation, but I want to show them in portrait mode.
iOS Implementation:
We have to install this component https://components.xamarin.com/view/elcimagepicker
For sending the images to the Forms projects I’m using a Messenging Center.
Also in iOS we have to add the permission for Gallery.
More Info: https://blog.xamarin.com/new-ios-10-privacy-permission-settings/
Xamarin Forms Implementation:
For show the images in XForms I’m using a package called FlowListView
https://github.com/daniel-luberda/DLToolkit.Forms.Controls/tree/master/FlowListView
And for caching the images and avoid memory issues:
https://www.nuget.org/packages/Xamarin.FFImageLoading.Forms/
An important detail is to clear the paths after using them, so we don’t have that local reference in our devices.
Android:
NOTE: This code is just compatible with Android > 4.3
iOS:
You can download the full code here:
https://github.com/CrossGeeks/Xamarin.Samples/tree/master/Xamarin%20Forms/SelectMultiIpleImagesApp
Happy Coding! 🙂
18 Comments
Mi vote of 5*.
I was looking for this.
Thank you very much
Hello. I test your sample but i can select only one image in Android.
Is there any device restriction?.
Not really, are you doing long press when selecting the images?
Also, what device are you using?
Hello Charlin,
I also used your code but stil i can only select one image in android.
my device is asus zenfone 5. Also i use genymotion google nexus 4 as emulator .
This solution is just compatible for Android > 4.3, if you are using that version it will only leave you select one image
Hello Char,
I have lost two days before seeing this : )
Anyway, thank you for the code you donated to the public.
However, do you think there is a way that the long press is replaced by just a tap? It seems not straight forward for user to guess that they have to press long. Thank you!
Your welcome 🙂
In Android/iOS?
Hello, This has been fantastic, thank you so much!! Is there any change of a UWP implementation also?
Yes! The plan is to create a NuGet Package (with UWP support too 🙂 )
Hello,
I have used your code and found that OpenGallery() function opens All Images in the mobile and SD card. I am able to select multiple images here. However If I go to Gallery and try to select multiple images it does not work. It allows me to select only one image here.
Any solution to this?
What device are you using for testing?
Hello, Charlin,
the code to pick multiple photos from Library is working fine, thanks a lot. But do you know how to upload those multiple photos to server (after you load the photos) just in one submit by Web API using Xamarin PCL? thanks in advance.
Hi Peter. You can use this plugin https://github.com/CrossGeeks/FileUploaderPlugin
When I try to run your sample, I am getting components not supported. How to import ELCImagepicker? Please update.
Yes! CImagePicker, is not longer supported, I will update the sample soon.
The sample provided above is very helpful in regards of Android. As I am novice to Xamarin Forms and iPhone development, I am hopeless with multiple Image picker. Waiting for your update on the same. Thank you.
Great very helpful