Camera not showing when ImagePickerLauncher called

[rnstewart]

I have been using GalleryPickerLauncher to select pictures from my Gallery, and it's working great. I am now working on adding Camera capability to my app. So I have added code to call ImagePickerLauncher as described in the documentation, but when I do that, nothing comes up.

It doesn't work on Android or iOS. On Android, it shows the camera icon on the right side of the status bar, indicating that the camera is in use, but no Camera UI appears in the app.

I've verified that I do have Camera permissions allowed for my app.

[ismoy]

Thanks for the report .

Could you please share:

The device model and OS version where this happens

The library version you are using

A minimal code snippet showing how you are launching ImagePickerLauncher

I tested on both Android and iOS and the Camera UI works fine, so this will help narrow down if it’s device-specific or an integration issue.
Please check your IOS permission
Don't forget to configure iOS-specific permissions in your Info.plist file:

<key>NSCameraUsageDescription</key>
<string>We need access to the camera to capture a photo.</string>  //Or your custom Message

Find info.plist file to add the request permission on IOS . Android is not necessary request the permission @rnstewart

[ismoy]

The other thing is you can just use ImagePicker Launch because it has the option to select from the gallery and capture photos, but I would like to know the model of the cell phone you are using to do some research.

[rnstewart]

Oh yeah, of course. Sorry, I should have included this information.

I'm testing it on Android 16 and iOS 18.5. The Compose code looks like this:

var photoGalleryParams by remember {
    mutableStateOf<PhotoParams?>(null)
}

...

photoGalleryParams?.let { photoParams ->
    when (photoParams.photoSource) {
        PhotoParams.PhotoSource.Camera -> {
            ImagePickerLauncher(
                config = ImagePickerConfig(
                    onPhotoCaptured = { result ->
                        // Save photo
                    },
                    onError = { error ->
                        photoGalleryParams = null
                    },
                    onDismiss = {
                        photoGalleryParams = null
                    }
                )
            )
        }
        PhotoParams.PhotoSource.Gallery -> {
            GalleryPickerLauncher(
                onPhotosSelected = { result ->
                    // Save photo
                },
                onError = { error ->
                    photoGalleryParams = null
                },
                onDismiss = {
                    photoGalleryParams = null
                }
            )
        }
        null -> {}
    }
}

PhotoParams is a Data Class I've defined that has some of the properties for images in my app:

data class PhotoParams(
    val photoType: PhotoType,
    val photoSource: PhotoSource? = null,
    val objectId: Long? = null
) {
    enum class PhotoType {
        Project, Bake, Avatar
    }

    enum class PhotoSource {
        Camera, Gallery
    }
}

So when I want to bring up the camera , I just set photoGalleryParams to the appropriate value and it triggers either ImagePickerLauncher or GalleryPickerLauncher.

I have verified that Camera permissions are set in Info.plist on iOS. And I know the app can open the camera, because I've been using another library for that.

[rnstewart]

OK, I'm sorry, I made a mistake. It looks like it is working on iOS after all. Sorry about that. So the problem is just getting the camera to show on Android.

Although I do have another question: when I trigger ImagePickerLauncher it brings up a bottom sheet asking if I want to take new picture or select one from the gallery. Is there any way I can tell it to skip directly to the Camera view? I already have a custom dialog for choosing camera/gallery, and I want to continue using that because it has some extra options as well.

[ismoy]

in this issue #32 resolve the problem @rnstewart

[ismoy]

Please update

dependencies {
    implementation("io.github.ismoy:imagepickerkmp:1.0.23")//lastversion
}

if (showCamera) {
    ImagePickerLauncher(
        config = ImagePickerConfig(
            onPhotoCaptured = { result ->
                capturedPhoto = result
                showCamera = false
            },
            onError = {
                showCamera = false
            },
            onDismiss = {
                showImagePicker = false // Reset state when user doesn't select anything
            },
            // New Flag
            directCameraLaunch = false // Set to true if you want to launch the camera directly Only IOS 
        )
    )
}

Button(onClick = { showCamera = true }) {
    Text("Take Photo")
}

[ismoy]

@rnstewart Thanks for sharing the details That code snippet helps a lot.

The issue is that ImagePickerLauncher and GalleryPickerLauncher should not be placed directly inside the when block. They are side-effect launchers and need to be controlled by state (similar to how rememberLauncherForActivityResult works in Jetpack Compose).

In your code, the camera session is being created (that’s why you see the camera icon in Android), but the UI never shows because the launcher isn’t properly tied to the composition lifecycle.

Here’s a working example adapted to your PhotoParams setup:

@Composable
fun PhotoPickerScreen() {
    var photoGalleryParams by remember {
        mutableStateOf<PhotoParams?>(null)
    }

    // Flags to control camera/gallery
    var showCamera by remember { mutableStateOf(false) }
    var showGallery by remember { mutableStateOf(false) }

    // React when photoGalleryParams changes
    LaunchedEffect(photoGalleryParams) {
        when (photoGalleryParams?.photoSource) {
            PhotoParams.PhotoSource.Camera -> showCamera = true
            PhotoParams.PhotoSource.Gallery -> showGallery = true
            null -> {
                showCamera = false
                showGallery = false
            }
        }
    }

    // Camera picker
    if (showCamera) {
        ImagePickerLauncher(
            config = ImagePickerConfig(
                onPhotoCaptured = { result ->
                    // Save photo
                    showCamera = false
                    photoGalleryParams = null
                },
                onError = { error ->
                    showCamera = false
                    photoGalleryParams = null
                },
                onDismiss = {
                    showCamera = false
                    photoGalleryParams = null
                }
            )
        )
    }

    // Gallery picker
    if (showGallery) {
        GalleryPickerLauncher(
            onPhotosSelected = { result ->
                // Save photos
                showGallery = false
                photoGalleryParams = null
            },
            onError = { error ->
                showGallery = false
                photoGalleryParams = null
            },
            onDismiss = {
                showGallery = false
                photoGalleryParams = null
            }
        )
    }

    // Example buttons to trigger the pickers
    Column {
        Button(onClick = {
            photoGalleryParams = PhotoParams(
                photoType = PhotoParams.PhotoType.Project,
                photoSource = PhotoParams.PhotoSource.Camera
            )
        }) {
            Text("Open Camera")
        }

        Button(onClick = {
            photoGalleryParams = PhotoParams(
                photoType = PhotoParams.PhotoType.Project,
                photoSource = PhotoParams.PhotoSource.Gallery
            )
        }) {
            Text("Open Gallery")
        }
    }
}

With this approach, the pickers are only added to the composition when needed, and dismissed properly after capturing or selecting a photo. This ensures the Camera UI (or Gallery UI) is shown correctly on both Android and iOS.

[ismoy]

Try the proposal I gave you adapted to your code. If it worked for you, let me know so I can move the issue to discussion because it is not an issue.

[ismoy]

ImagePickerLauncher has the 2 functionalities of taking photos and selecting from the gallery. When using ImagePickerLauncher you will have the 2 options: taking photos and choosing. These are not unnecessary options. In iOS it is handled differently, but you can customize that dialog to your liking. But for now, in the library, when calling ImagePickerLauncher in iOS, the dialog will always appear. In the next version, we can remove that option and have it go directly to the camera with a flag.

[rnstewart]

I'm sorry it took me so long to get back, but I still can't get the camera to open in Compose on Android. As far as I can tell, my code is basically the same as yours. I have a PhotoParams class that I use to define the type of photo I'm going to be getting:

data class PhotoParams(
    val photoType: PhotoType,
    val photoSource: PhotoSource? = null,
    val objectId: Long? = null
) {
    enum class PhotoType {
        Progress, Avatar
    }

    enum class PhotoSource {
        Camera, Gallery
    }
}

Don't worry about the photoType and objectId parameters, those aren't relevant here. What matters is photoSource. In my MainScreen I have:

    var photoGalleryParams by remember {
        mutableStateOf<PhotoParams?>(null)
    }

    ...

    val photoSource = photoGalleryParams?.photoSource
    val photoType = photoGalleryParams?.photoType
    if (photoSource == PhotoParams.PhotoSource.Gallery && photoType != null) {
        GalleryPickerLauncher(
            onPhotosSelected = {
                galleryPhotoResults = mapOf(photoType to it)
                photoGalleryParams = null
            },
            onError = {
                galleryPhotoResults = mapOf()
                photoGalleryParams = null
            },
            onDismiss = {
                galleryPhotoResults = mapOf()
                photoGalleryParams = null
            }
        )
    } else if (photoGalleryParams?.photoSource == PhotoParams.PhotoSource.Camera && photoType != null) {
        ImagePickerLauncher(
            config = ImagePickerConfig(
                onPhotoCaptured = {
                    cameraPhotoResult = mapOf(photoType to it)
                },
                onError = {
                    cameraPhotoResult = mapOf()
                },
                onDismiss = {
                    cameraPhotoResult = mapOf()
                    photoGalleryParams = null
                },
                directCameraLaunch = true
            )
        )
    }

The Gallery works fine, but when I tell it to open the camera, it doesn't show. It does show the little green icon in the upper right corner of the screen, indicating that Android thinks the camera is open. It requests permission the first time, and I grant it. I've also added CAMERA permission to the Manifest. And I'm on v1.0.23 of the library.

I'm not sure what else I could be missing here.

[ismoy]

is a KMP proyect o native android?

[rnstewart]

It's KMP. That's why I had the directCameraLaunch parameter in there, because this will also need to run on iOS.

[rnstewart]

Just for the heck of it, I tried adding the ImagePickerLauncher by itself, with no variable:

    ImagePickerLauncher(
        config = ImagePickerConfig(
            onPhotoCaptured = {
            },
            onError = {
            },
            onDismiss = {
            }
        )
    )

If I'm understanding it correctly, this should automatically launch the camera when the Compose screen opens. But it's still doing the same thing; it's just showing the green icon in the upper right, but no Camera view.

[ismoy]

https://github.com/ismoy/ImagePickerKMPDemo
I hope it helps you, it is adapted to your code

[ismoy]

How the library works summarizes a bit of the documentation both ImagePickerLauncher and GalleryLauncher need a trigger for that you can create a boolean variable to change its state when you click when the camera is activated the phone will indicate that you are using the camera it is removed when you finish taking the photo and set the use of the camera to false there should not indicate that it is using the camera the management of the states are key

[rnstewart]

Aha! Got it.

This was just a layout issue. I was expecting the camera picker to pop up as a bottom sheet like the gallery picker. I didn't realize it was an embedded view. I just changed my Compose layout to a Box with the ImagePickerLauncher on top, and now it works. I knew it had to be something stupid and simple like that.

Thank you very much!

[dastageerb]

Hi guys, I also ran into the same issue. Thanks @rnstewart for the clarification!
I noticed the camera usage indicator appeared, but the preview didn’t show up because it wasn’t inside a container. I think many others might run into this as well — maybe the owner could add a small disclaimer😅

@ismoy

[ismoy]

Hello, please follow the library documentation to ensure you're using the Composable component correctly.
The library will always require an activator and doesn't have to be inside a Composable.
I didn't include a disclaimer because it's not a problem; it's a matter of how the end user uses it. Thank you very much for using ImagePickerKMP. I hope it helps with your project.