Pick Multiple Images from the Gallery - Android Studio - Kotlin
How to pick multiple images from the Gallery?
There are some scenarios in which we need to pick multiple images from the Gallery. For example, on Facebook, you are familiar with adding multiple images in a single Post. In this tutorial, we will learn how can upload multiple images from the Gallery. You can pick single or as well as multiple images after learning this tutorial. After picking images, we will show those images in ImageSwitcher.
If you want to learn to pick a single Image from the Gallery, you can check for Java OR Kotlin OR Compose
Video:
Step 1: Create a new project OR Open your existing project
Code
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:padding="20dp"
tools:context=".MainActivity">
<!--Picked images will be shown here-->
<ImageSwitcher
android:id="@+id/imagesIs"
android:layout_width="match_parent"
android:layout_height="400dp"
tools:background="#959595" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginVertical="8dp"
android:orientation="horizontal">
<!--Show previous image on ImageSwitcher clicking this button-->
<com.google.android.material.button.MaterialButton
android:id="@+id/previousBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Previous" />
<Space
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<!--Show Next image on ImageSwitcher clicking this button-->
<com.google.android.material.button.MaterialButton
android:id="@+id/nextBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Next" />
</LinearLayout>
<!--Pick images clicking this button-->
<com.google.android.material.button.MaterialButton
android:id="@+id/pickImagesBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Pick Images" />
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/main" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:orientation="vertical" android:padding="20dp" tools:context=".MainActivity"> <!--Picked images will be shown here--> <ImageSwitcher android:id="@+id/imagesIs" android:layout_width="match_parent" android:layout_height="400dp" tools:background="#959595" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginVertical="8dp" android:orientation="horizontal"> <!--Show previous image on ImageSwitcher clicking this button--> <com.google.android.material.button.MaterialButton android:id="@+id/previousBtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Previous" /> <Space android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" /> <!--Show Next image on ImageSwitcher clicking this button--> <com.google.android.material.button.MaterialButton android:id="@+id/nextBtn" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Next" /> </LinearLayout> <!--Pick images clicking this button--> <com.google.android.material.button.MaterialButton android:id="@+id/pickImagesBtn" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Pick Images" /> </LinearLayout>
MainActivity.kt
package com.technifysoft.myapplication
import android.content.Intent
import android.net.Uri
import android.os.Bundle
import android.util.Log
import android.widget.ImageView
import android.widget.Toast
import androidx.activity.enableEdgeToEdge
import androidx.activity.result.contract.ActivityResultContracts
import androidx.appcompat.app.AppCompatActivity
import com.technifysoft.myapplication.databinding.ActivityMainBinding
class MainActivityKt : AppCompatActivity() {
private lateinit var binding: ActivityMainBinding
private val TAG = "MAIN_TAG"
//store image uris in this array list
private lateinit var imageUris: ArrayList<Uri>
//position of selected image
var position = 0
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
binding = ActivityMainBinding.inflate(layoutInflater)
setContentView(binding.root)
//init list
imageUris = ArrayList()
//setup image switcher
binding.imagesIs.setFactory {
val imageView = ImageView(this)
imageView
}
//click handle, pick images
binding.pickImagesBtn.setOnClickListener { pickImageGallery() }
//click handle, show previous image
binding.previousBtn.setOnClickListener {
if (position > 0) {
position--
binding.imagesIs.setImageURI(imageUris[position])
} else {
Toast.makeText(this, "No Previous images...", Toast.LENGTH_SHORT).show()
}
}
//click handle, show next image
binding.nextBtn.setOnClickListener {
if (position < imageUris.size - 1) {
position++
binding.imagesIs.setImageURI(imageUris[position])
} else {
Toast.makeText(this, "No More images...", Toast.LENGTH_SHORT).show()
}
}
}
private fun pickImageGallery() {
Log.d(TAG, "pickImageGallery: ")
//Intent to launch Images Picker e.g. Gallery
val intent = Intent(Intent.ACTION_GET_CONTENT)
intent.setType("image/*")
intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true)
galleryActivityResultLauncher.launch(intent)
}
private val galleryActivityResultLauncher = registerForActivityResult(
ActivityResultContracts.StartActivityForResult()
) { result ->
//Check if image is picked or not
if (result.resultCode == RESULT_OK) {
//Image Picked from Gallery, get data/intent from ActivityResult
val data = result.data
if (data!!.clipData != null) {
//picked multiple images
//get number of picked images
val count = data.clipData!!.itemCount
for (i in 0 until count) {
val imageUri = data.clipData!!.getItemAt(i).uri
//add image to list
imageUris.add(imageUri)
}
//set first image from list to image switcher
binding.imagesIs.setImageURI(imageUris[0])
position = 0
} else {
//picked single image
val imageUri = data.data
//set image to image switcher
binding.imagesIs.setImageURI(imageUri)
position = 0
}
} else {
//Cancelled
Log.d(TAG, "onActivityResult: Cancelled...")
Toast.makeText(this, "Cancelled", Toast.LENGTH_SHORT).show()
}
}
}
package com.technifysoft.myapplication import android.content.Intent import android.net.Uri import android.os.Bundle import android.util.Log import android.widget.ImageView import android.widget.Toast import androidx.activity.enableEdgeToEdge import androidx.activity.result.contract.ActivityResultContracts import androidx.appcompat.app.AppCompatActivity import com.technifysoft.myapplication.databinding.ActivityMainBinding class MainActivityKt : AppCompatActivity() { private lateinit var binding: ActivityMainBinding private val TAG = "MAIN_TAG" //store image uris in this array list private lateinit var imageUris: ArrayList<Uri> //position of selected image var position = 0 override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) enableEdgeToEdge() binding = ActivityMainBinding.inflate(layoutInflater) setContentView(binding.root) //init list imageUris = ArrayList() //setup image switcher binding.imagesIs.setFactory { val imageView = ImageView(this) imageView } //click handle, pick images binding.pickImagesBtn.setOnClickListener { pickImageGallery() } //click handle, show previous image binding.previousBtn.setOnClickListener { if (position > 0) { position-- binding.imagesIs.setImageURI(imageUris[position]) } else { Toast.makeText(this, "No Previous images...", Toast.LENGTH_SHORT).show() } } //click handle, show next image binding.nextBtn.setOnClickListener { if (position < imageUris.size - 1) { position++ binding.imagesIs.setImageURI(imageUris[position]) } else { Toast.makeText(this, "No More images...", Toast.LENGTH_SHORT).show() } } } private fun pickImageGallery() { Log.d(TAG, "pickImageGallery: ") //Intent to launch Images Picker e.g. Gallery val intent = Intent(Intent.ACTION_GET_CONTENT) intent.setType("image/*") intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true) galleryActivityResultLauncher.launch(intent) } private val galleryActivityResultLauncher = registerForActivityResult( ActivityResultContracts.StartActivityForResult() ) { result -> //Check if image is picked or not if (result.resultCode == RESULT_OK) { //Image Picked from Gallery, get data/intent from ActivityResult val data = result.data if (data!!.clipData != null) { //picked multiple images //get number of picked images val count = data.clipData!!.itemCount for (i in 0 until count) { val imageUri = data.clipData!!.getItemAt(i).uri //add image to list imageUris.add(imageUri) } //set first image from list to image switcher binding.imagesIs.setImageURI(imageUris[0]) position = 0 } else { //picked single image val imageUri = data.data //set image to image switcher binding.imagesIs.setImageURI(imageUri) position = 0 } } else { //Cancelled Log.d(TAG, "onActivityResult: Cancelled...") Toast.makeText(this, "Cancelled", Toast.LENGTH_SHORT).show() } } }


Comments
Post a Comment