Jetpack Compose - ClickableText

Penting

Pembahasan ini merupakan rentetan dari topik pembahasan tentang Dasar Dasar Jetpack Compose, terdapat hampir 100 pembahasan, untuk melihat daftarnya silahkan klik DAFTAR PEMBAHASAN COMPOSE

Pengertian

Simplenya, kalian ingin membuat text kalian bisa di klik? maka gunakanlah ClickableText di aplikasi kalian. akan tetapi, menurut hemat kami, ClickableText ini kurang manfaatnya karena dengan text biasaaja kita bisa memberikan click action pada parameter modfiernya.

@Composable
fun ClickableText(
    text: AnnotatedString,
    modifier: Modifier = Modifier,
    style: TextStyle = TextStyle.Default,
    softWrap: Boolean = true,
    overflow: TextOverflow = TextOverflow.Clip,
    maxLines: Int = Int.MAX_VALUE,
    onTextLayout: (TextLayoutResult) -> Unit = {},
    onClick: (Int) -> Unit
)

Semua fungsi dari masing masing atribut/parameter yang dimiliki oleh ClickableText sudah ada penjelasan lengkapnya di post tentang Text kalian bisa baca dulu disana jika memang diperlukan. Perbedaan yang sangat mencolok dari Text dan ClickableText adalah pada parameter onClick dimana parameter ini merupan callback yang dapat mendeteksi text kalian sedang di klik atau tidak. Cara penggunaananya pun sama, hanya saja, pada ClickableText parameter text tidak bertipe string, melainkan bertipe AnnotatedString.

Cara penggunaan

Berikut adalah contoh kodingan dengan ClickableText

@Composable
fun ClickableTextDemo() {
    ClickableText(text = AnnotatedString("The Ngoding"),
        onClick = {_->//disini ada nilai yang dapat ditangkap berupa int

    })
}

sedangkan dibawah ini adalah contoh penggunaan text biasa dengan ditambahkan funcgsi clickable

@Composable
fun ClickText() {
    Text(text = "The Ngoding",
        modifier = Modifier.clickable {
        
            }
        )
}

Perbedaan lain antara ClickableText dan Text biasa meskipun sama sama bisa di klik adalah pada callbacknya, pada ClickableText, callback kliknya mengembalikan nilai int sedangkan pada Text biasa yang dikasih clickable tidak mengembalikan nilai apa-apa.

Video