Jetpack Compose consente un'interattività granulare in Text
. La selezione del testo è ora più flessibile e può essere eseguita in vari layout componibili. Le interazioni degli utenti
nel testo sono diverse da altri layout componibili, in quanto non è possibile aggiungere un modificatore
a una porzione di un componibile Text
. Questa pagina evidenzia le API che
consentono le interazioni degli utenti.
Seleziona testo
Per impostazione predefinita, gli elementi componibili non sono selezionabili, il che significa che gli utenti non possono
selezionare e copiare testo dalla tua app. Per attivare la selezione del testo, aggrega gli elementi di testo con un elemento componibile SelectionContainer
:
@Composable fun SelectableText() { SelectionContainer { Text("This text is selectable") } }
Puoi disattivare la selezione di parti specifiche di un'area selezionabile. Per farlo, devi racchiudere la parte non selezionabile in un elemento componibile 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") } } }
Ottieni la posizione di un clic sul testo
Per ascoltare i clic su Text
, puoi aggiungere il modificatore di clickable
. Tuttavia, per ottenere la posizione di un clic all'interno di un componibile Text
, nel caso in cui tu abbia azioni diverse in base a parti diverse del testo, dovrai utilizzare invece un ClickableText
:
@Composable fun SimpleClickableText() { ClickableText(text = AnnotatedString("Click Me"), onClick = { offset -> Log.d("ClickableText", "$offset -th character is clicked.") }) }
Clic con annotazione
Quando un utente fa clic su un componibile Text
, può essere opportuno collegare ulteriori informazioni a una parte del valore Text
, ad esempio un URL allegato a una parola specifica da aprire in un browser. Per farlo, devi allegare un'annotazione, che utilizza come parametri un tag (String
), un elemento (String
) e un intervallo di testo. Da un AnnotatedString
, queste annotazioni possono essere filtrate in base
ai relativi tag o intervalli di testo. Ecco un esempio:
@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) } }) }
Consigliato per te
- Nota: il testo del link viene visualizzato quando JavaScript è disattivato
- Semantica nella scrittura
- Accessibilità in Compose
- Material Design 2 in Compose