O Jetpack Compose permite interatividade detalhada no Text
. A seleção de texto agora
é mais flexível e pode ser feita em layouts de composição. As interações do usuário
nos textos são diferentes de outros layouts do mesmo tipo, já que não é possível adicionar um modificador
a uma parte de um elemento Text
. Esta página destaca as APIs
que permitem interações do usuário.
Selecionar texto
Por padrão, os elementos combináveis não podem ser selecionados, o que significa que os usuários não
podem selecionar e copiar textos do app. Para ativar a seleção de texto, envolva
os elementos de texto com um elemento combinável SelectionContainer
:
@Composable fun SelectableText() { SelectionContainer { Text("This text is selectable") } }
Você pode desativar a seleção de texto em partes específicas de uma área selecionável. Para
fazer isso, é necessário unir a parte que não pode ser selecionada a um elemento combinável
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") } } }
Obter a posição de um clique no texto
Para detectar cliques no Text
, adicione o modificador
clickable
. No entanto, se você quiser saber a posição de um clique em um
elemento Text
combinável, caso haja ações diferentes com base em
partes distintas do texto, use um
ClickableText
:
@Composable fun SimpleClickableText() { ClickableText(text = AnnotatedString("Click Me"), onClick = { offset -> Log.d("ClickableText", "$offset -th character is clicked.") }) }
Clique com anotação
Quando um usuário clica em um elemento combinável Text
, você pode anexar mais
informações a uma parte do valor do Text
, como um URL anexado a uma palavra específica
que é aberto em um navegador. Para fazer isso, anexe uma
anotação, que usa uma tag (String
), um item (String
) e um intervalo de texto
como parâmetros. A partir de uma AnnotatedString
, essas anotações podem ser filtradas
de acordo com as tags ou intervalos de texto. Confira um exemplo:
@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) } }) }
Recomendados para você
- Observação: o texto do link aparece quando o JavaScript está desativado.
- Semântica no Compose
- Acessibilidade no Compose
- Material Design 2 no Compose