How can i parse Uri String for loading image from gallery in jetpack compose with Coil?

Viewed 690

Let say i have image components can show image from selected image from gallery;

@Composable
fun ClickableToGalleryImage() {
    var imageUri by remember {
        mutableStateOf<Uri?>(null)
    }
    val launcher = rememberLauncherForActivityResult(
        contract = ActivityResultContracts.GetContent()
    ) { uri: Uri? ->
        println(imageUri)
        imageUri = uri
    }
    Box(
        modifier = Modifier.fillMaxSize(),
        contentAlignment = Alignment.Center
    ) {
        Image(
            painter = rememberAsyncImagePainter(
                ImageRequest
                    .Builder(LocalContext.current)
                    .data(data = imageUri)
                    .build()
            ),
            contentDescription = null,
            modifier = Modifier
                .clickable { launcher.launch("image/*") }
                .size(100.dp)
                .clip(CircleShape)
                .border(2.dp, Color.Gray, CircleShape),
            contentScale = ContentScale.Crop
        )
    }
}

this works very well.

But if i extract the imageUri value;

I/System.out: content://com.android.providers.media.documents/document/image%3A33

and manually type the imageUri variable;

Image(
        painter = rememberAsyncImagePainter(
            ImageRequest
                .Builder(LocalContext.current)
                .data(data = "content://com.android.providers.media.documents/document/image%3A33")
                .build()
        ),
        contentDescription = null,
        modifier = Modifier
            .size(100.dp)
            .clip(CircleShape)
            .border(2.dp, Color.Gray, CircleShape),
        contentScale = ContentScale.Crop
    )

Coil can't load picture. Why is that? And how can i show picture from gallery with uri?

1 Answers
Related