Jetpack Composeでユーザーが選択した画像を表示する

Jetpack Composeでユーザーが選択した画像を表示するサンプルプログラム。

build.grable(:app)を編集する

dependencies {
    implementation "io.coil-kt:coil:1.4.0" //追加
}

ユーザーが選択した画像を表示する

ActivityResultContracts.GetContent()でユーザーに画像の選択を促します。
画像が選択されると、選択された画像のURLをimageUriに設定します。

ImageにはimageUriの画像を表示します。
ユーザーが画像を選択するとImageに表示されます。

@Composable
fun LoadImage() {
    var imageUri by remember { mutableStateOf<Uri?>(null) }
    val launcher =
        rememberLauncherForActivityResult(ActivityResultContracts.GetContent()) { uri: Uri? ->
            imageUri = uri
        }

    Column {
        Button(onClick = { launcher.launch("image/*") }) {
            Text(text = "Load Image")
        }
        Image(
            painter = rememberImagePainter(imageUri),
            contentDescription = "My Image",
            modifier = Modifier.fillMaxSize()
        )
    }
}

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください