הפעלת האינטראקציות של המשתמשים

‫Jetpack Compose מאפשר אינטראקטיביות מפורטת ב-Text. עכשיו בחירת הטקסט גמישה יותר ואפשר לבצע אותה בפריסות קומפוזביליות. אינטראקציות של משתמשים בטקסט שונות מפריסות אחרות של רכיבים, כי אי אפשר להוסיף משתנה לחלק של רכיב Text. בדף הזה מודגשים ממשקי ה-API שמאפשרים אינטראקציות של משתמשים.

בחירת טקסט

כברירת מחדל, אי אפשר לבחור רכיבים קומפוזביליים, כלומר המשתמשים לא יכולים לבחור ולהעתיק טקסט מהאפליקציה. כדי לאפשר בחירת טקסט, צריך לעטוף את רכיבי הטקסט ברכיב קומפוזבילי מסוג SelectionContainer:

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

קטע טקסט קצר שהמשתמש בחר.

יכול להיות שתרצו להשבית את הבחירה בחלקים ספציפיים של אזור שניתן לבחור. כדי לעשות את זה, צריך לעטוף את החלק שלא ניתן לבחירה באמצעות רכיב ה-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")
        }
    }
}

קטע טקסט ארוך יותר. המשתמש ניסה לבחור את כל הפסקה, אבל שתי שורות לא נבחרו כי הוחלה עליהן התכונה DisableSelection.

יצירת קטעי טקסט עם קישורים באמצעות LinkAnnotation

כדי להאזין לקליקים על Text, אפשר להוסיף את המשתנה clickable. עם זאת, יכול להיות שתרצו לצרף מידע נוסף לחלק מסוים בערך של Text, כמו כתובת URL שמצורפת למילה מסוימת כדי לפתוח אותה בדפדפן. במקרים כאלה, צריך להשתמש ב-LinkAnnotation, שהוא הערה שמייצגת חלק מהטקסט שאפשר ללחוץ עליו.

באמצעות LinkAnnotation, אתם יכולים לצרף כתובת URL לחלק של פונקציה קומפוזבילית Text שנפתחת באופן אוטומטי כשלוחצים עליה, כמו בקטע הקוד הבא:

@Composable
fun AnnotatedStringWithLinkSample() {
    // Display multiple links in the text
    Text(
        buildAnnotatedString {
            append("Go to the ")
            withLink(
                LinkAnnotation.Url(
                    "https://developer.android.com/",
                    TextLinkStyles(style = SpanStyle(color = Color.Blue))
                )
            ) {
                append("Android Developers ")
            }
            append("website, and check out the")
            withLink(
                LinkAnnotation.Url(
                    "https://developer.android.com/jetpack/compose",
                    TextLinkStyles(style = SpanStyle(color = Color.Green))
                )
            ) {
                append("Compose guidance")
            }
            append(".")
        }
    )
}

אפשר גם להגדיר פעולה מותאמת אישית בתגובה לקליק של משתמש על חלק מהרכיב הניתן לקישור Text. בקטע הקוד הבא, כשמשתמש לוחץ על Jetpack Compose, מוצג קישור, והמדדים נרשמים אם המשתמש לוחץ על הקישור:

@Composable
fun AnnotatedStringWithListenerSample() {
    // Display a link in the text and log metrics whenever user clicks on it. In that case we handle
    // the link using openUri method of the LocalUriHandler
    val uriHandler = LocalUriHandler.current
    Text(
        buildAnnotatedString {
            append("Build better apps faster with ")
            val link =
                LinkAnnotation.Url(
                    "https://developer.android.com/jetpack/compose",
                    TextLinkStyles(SpanStyle(color = Color.Blue))
                ) {
                    val url = (it as LinkAnnotation.Url).url
                    // log some metrics
                    uriHandler.openUri(url)
                }
            withLink(link) { append("Jetpack Compose") }
        }
    )
}