Nutzerinteraktionen aktivieren

Jetpack Compose ermöglicht eine fein abgestimmte Interaktivität in Text. Die Textauswahl ist jetzt flexibler und kann in zusammensetzbaren Layouts erfolgen. Nutzerinteraktionen im Text unterscheiden sich von anderen zusammensetzbaren Layouts, da Sie einem Teil einer zusammensetzbaren Funktion Text keinen Modifikator hinzufügen können. Auf dieser Seite werden die APIs vorgestellt, die Nutzerinteraktionen ermöglichen.

Text auswählen

Standardmäßig sind zusammensetzbare Funktionen nicht auswählbar. Das bedeutet, dass Nutzer weder Text auswählen noch aus Ihrer App kopieren können. Um die Textauswahl zu aktivieren, umbrechen Sie Ihre Textelemente mit einer zusammensetzbaren Funktion SelectionContainer:

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

Eine kurze Textpassage, die der Nutzer ausgewählt hat.

Sie können die Auswahl bestimmter Teile eines auswählbaren Bereichs deaktivieren. Dazu müssen Sie den nicht auswählbaren Teil mit einer zusammensetzbaren Funktion DisableSelection umschließen:

@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

Eine längere Textpassage. Der Nutzer hat versucht, den gesamten Abschnitt auszuwählen, aber da die Funktion „DisableSelection“ in zwei Zeilen angewendet wurde, waren sie nicht ausgewählt.

Position von Klicks auf Text abrufen

Fügen Sie den Modifizierer clickable hinzu, um Klicks auf Text zu erfassen. Wenn Sie jedoch die Position eines Klicks innerhalb einer zusammensetzbaren Funktion Text abrufen möchten und verschiedene Aktionen basierend auf verschiedenen Teilen des Textes ausführen, müssen Sie stattdessen ClickableText verwenden:

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

Klick mit Anmerkung

Wenn ein Nutzer auf eine zusammensetzbare Funktion Text klickt, möchten Sie möglicherweise zusätzliche Informationen an einen Teil des Werts Text anhängen, z. B. eine URL, die mit einem bestimmten Wort verknüpft ist und in einem Browser geöffnet werden soll. Dazu müssen Sie eine Annotation anhängen, die ein Tag (String), ein Element (String) und einen Textbereich als Parameter verwendet. Diese Annotationen aus einem AnnotatedString können anhand ihrer Tags oder Textbereiche gefiltert werden. Hier ist ein Beispiel:

@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