Android implementation

Backer posted 2 min read

Tutorial: How to Use ImagePickerKMP in Android with Jetpack Compose

Picking images from the gallery or capturing from the camera has always been tricky in Android: dealing with permissions, intents, and different APIs.
With ImagePickerKMP, you can handle it in a declarative and clean way using Jetpack Compose, without worrying about the platform-specific details.

In this tutorial, you’ll learn how to:

  • Integrate ImagePickerKMP in an Android app with Jetpack Compose.
  • Show a live camera preview.
  • Select images from the gallery.
  • Customize the UI with the Customization API.

Step 1: Setup the dependency

Add the dependency in your build.gradle.kts (module level):

dependencies {
    implementation("io.github.ismoy:imagepickerkmp:1.0.22") // Replace with the latest version
}

Step 2: Basic usage in Compose

ImagePickerKMP exposes an ImagePicker composable you can use directly.
Here’s the minimal example to open the camera or gallery:

ImagePickerLauncher(
        config = ImagePickerConfig(
            onPhotoCaptured = { result ->
               // result here            },
            onError = {
                //ppermission denied error on something else
            },
            onDismiss = {
                showImagePicker = false // Reset state when user doesn't select anything
            }
        )
    )

✅ This automatically handles:

Camera permissions.

Returning the result as URI / uri.

Step 3: UI Customization

ImagePickerKMP provides a Customization API so you can style your picker UI.
For example, let’s customize the TopBar and bottom controls:

ImagePickerLauncher(
                            config = ImagePickerConfig(
                                onPhotoCaptured = { result ->
                                    photoResult = result
                                    showCameraPicker = false
                                    isPickerSheetVisible = false
                                },
                                onError = {
                                    showCameraPicker = false
                                    isPickerSheetVisible = false
                                },
                                onDismiss = {
                                    showCameraPicker = false
                                    isPickerSheetVisible = false
                                },
                                 cameraCaptureConfig = CameraCaptureConfig(
                                    permissionAndConfirmationConfig = PermissionAndConfirmationConfig(
                                        customConfirmationView = { photoResult, onConfirm, onRetry ->
                                            CustomAndroidConfirmationView(
                                                result = photoResult,
                                                onConfirm = onConfirm,
                                                onRetry = onRetry
                                            )
                                        },
                                        customDeniedDialog = { onRetry ->
                                            CustomPermissionDialog(
                                                title = "Permission Required",
                                                message = "We need access to the camera to take photos",
                                                onRetry = onRetry
                                            )
                                        },
                                        customSettingsDialog = { onOpenSettings ->
                                            CustomPermissionSettingsDialog(
                                                title = "Go to Settings",
                                                message = "Camera permission is required to capture photos. Please grant it in  settings",
                                                onOpenSettings = onOpenSettings
                                            )
                                        }
                                    )
                                )
                            )
                        )

With this, you completely control the UI while still using the library’s camera engine.

Step 4: Multiple image selection

You can also allow multiple images to be selected from the gallery:

 GalleryPickerLauncher(
        onPhotosSelected = { photos ->
           //result
        },
        onError = { error ->
           //error
        },
        onDismiss = {
           //when the result is null
        },
        allowMultiple = true, // False for single selection
        mimeTypes = listOf("image/jpeg", "image/png"), // Optional: filter by type
    )

Conclusion

With ImagePickerKMP you can:

Easily integrate camera and gallery in Jetpack Compose.

Customize the UI and user experience.

Use the same API across Android & iOS with Kotlin Multiplatform.

This saves you from handling ActivityResultContracts, Uri parsing, and permission requests manually — all while keeping your code clean and declarative.

0 votes

More Posts

RingtoneSmartKit – Android Ringtone Tool

Amjd Alhashede - Jul 16

A Kotlin library that simplifies setting and managing Android ringtones programmatically

Amjd Alhashede - Jul 15

Best Security implementation Practices In NestJS. A Comprehensive Guide

Ebenezer Boyinbode - Aug 21

How To Run Ollama In Android (Without Root)

H4Ck3R - Aug 7

Koin on modularization: How to use it?

Mikkel Septiano - Mar 15
chevron_left