Memungkinkan interaksi pengguna

Jetpack Compose memungkinkan interaksi yang lebih mendetail di Text. Pemilihan teks kini lebih fleksibel dan dapat dilakukan di seluruh tata letak composable. Interaksi pengguna dalam teks berbeda dengan tata letak composable lainnya, karena Anda tidak dapat menambahkan pengubah ke bagian dari composable Text. Halaman ini menyoroti API yang memungkinkan interaksi pengguna.

Pilih teks

Secara default, composable tidak dapat dipilih, yang berarti pengguna tidak dapat memilih dan menyalin teks dari aplikasi Anda. Untuk mengaktifkan pemilihan teks, gabungkan elemen teks Anda dengan composable SelectionContainer:

@Composable
fun SelectableText() {
    SelectionContainer {
        Text("This text is selectable")
    }
}
TextSnippets.kt

Anda mungkin ingin menonaktifkan pilihan pada bagian tertentu dari area yang dapat dipilih. Untuk melakukannya, Anda harus menggabungkan bagian yang tidak dapat dipilih dengan composable DisableSelection:

@Composable
fun PartiallySelectableText() {
    SelectionContainer {
        Column {
            Text("This text is selectable")
            Text("This one too")
            Text("This one as well")
            DisableSelection {
                Text("But not this one")
                Text("Neither this one")
            }
            Text("But again, you can select this one")
            Text("And this one too")
        }
    }
}
TextSnippets.kt

Mendapatkan posisi klik pada teks

Untuk memproses klik pada Text, Anda dapat menambahkan pengubah clickable. Namun, jika ingin mendapatkan posisi klik dalam composable Text, jika Anda memiliki tindakan yang berbeda berdasarkan bagian teks yang berbeda, Anda harus menggunakan ClickableText sebagai gantinya:

@Composable
fun SimpleClickableText() {
    ClickableText(text = AnnotatedString("Click Me"), onClick = { offset ->
        Log.d("ClickableText", "$offset -th character is clicked.")
    })
}
TextSnippets.kt

Mengklik dengan anotasi

Saat pengguna mengklik composable Text, Anda mungkin ingin melampirkan informasi tambahan ke bagian nilai Text, misalnya URL yang terkait dengan kata tertentu yang akan dibuka di browser. Untuk melakukannya, Anda harus melampirkan anotasi, yang memerlukan tag (String), item (String), dan rentang teks sebagai parameter. Dari AnnotatedString, anotasi ini dapat difilter dengan tag atau rentang teksnya. Berikut contohnya:

@Composable
fun AnnotatedClickableText() {
    val annotatedText = buildAnnotatedString {
        append("Click ")

        // We attach this *URL* annotation to the following content
        // until `pop()` is called
        pushStringAnnotation(
            tag = "URL", annotation = "https://developer.android.com"
        )
        withStyle(
            style = SpanStyle(
                color = Color.Blue, fontWeight = FontWeight.Bold
            )
        ) {
            append("here")
        }

        pop()
    }

    ClickableText(text = annotatedText, onClick = { offset ->
        // We check if there is an *URL* annotation attached to the text
        // at the clicked position
        annotatedText.getStringAnnotations(
            tag = "URL", start = offset, end = offset
        ).firstOrNull()?.let { annotation ->
            // If yes, we log its value
            Log.d("Clicked URL", annotation.item)
        }
    })
}
TextSnippets.kt