Introdução

Olá a todos, neste breve artigo mostrarei como exibir texto HTML no Android. No momento da redação deste artigo, o texto que pode ser composto do Jetpack não nos permite fazer isso. Mas, graças ao excelente suporte de interoperabilidade para composição, podemos usar TextView ou MaterialTextView para exibir texto em estilo html.

Pré-requisitos

• Conhecimento sobre o uso de exibições na composição usando o elemento que pode ser composto do AndroidView.
• Conhecimento básico de como trabalhar com o Jetpack compose.

O texto HTML é, como o nome indica, um pedaço de texto formatado usando tags HTML. Uma coisa muito importante a ser observada aqui é que nem todas as tags são suportadas no Android. Apenas algumas tags básicas são suportadas.

Uso de texto HTML no contexto do Android

Muitos endpoints de API usam esse formato para armazenar conteúdo textual. Um endpoint pode fazer uso disso por vários motivos. Aqui está um exemplo de tal endpoint — A API do Spotify.

Ao enviar uma solicitação à API do Spotify para obter informações sobre um episódio de podcast, além de fornecer a versão em texto simples da descrição do episódio, também fornece uma versão formatada em html da descrição.

{
  .
  .  
  "description" : "........."
  "html_description" : ".........."
  .
  .
}

Analisando texto formatado em HTML

Para analisar uma string que contém texto formatado em html em algo que a visualização de texto do Android possa usar, a HtmlCompactclasse pode ser usada. A HtmlCompat classe é uma versão da Htmlclasse que oferece compatibilidade com versões anteriores do Android. Aqui está a documentação de classe para as classes Html e HtmlCompat.

O HtmlCompat.fromHtml()método pode ser usado para converter uma string Html em um objeto Spanned que pode ser usado com TextView ou MaterialTextView do Android. O primeiro argumento da função é a string de origem e o segundo argumento permite que você especifique certos sinalizadores que podem ser usados ​​para personalizar o comportamento de análise da função. Explicar o uso de cada sinalizador está fora do escopo deste artigo. Podemos apenas passar 0, se não precisarmos especificar nenhum sinalizador.

// parsing html string using the HtmlCompat class
val spannedText = HtmlCompat.fromHtml(sourceString, 0)

Depois que o texto for convertido, podemos passá-lo para o TextView para exibi-lo. Como estamos usando o compose, usaremos o AndroidView que pode ser composto para usar o TextView como um que pode ser composto.

AndroidView(
    modifier = modifier,
    factory = { MaterialTextView(it) }, 
    update = { it.text = spannedText }
)

Bônus! — Torne os links clicáveis!

Se houver algum link no texto, podemos torná-lo clicável definindo a autoLinkMask propriedade como Linkify.WEB_URLS e definindo a linksClickablepropriedade como true.

AndroidView(
     modifier = modifier,
     factory = {
      MaterialTextView(it).apply {
            // links
            autoLinkMask = Linkify.WEB_URLS
            linksClickable = true
            // setting the color to use forr highlihting the links
            setLinkTextColor(Color.White.toArgb()) 
          }
      },
     update = {
        it.maxLines = currentMaxLines
        it.text = text
    }
)

Conclusão

E isso encerra este pequeno post de blog! Você poderia estar fazendo um milhão de outras coisas, mas decidiu sentar e ler este artigo para saber como exibir um texto HTML no Jetpack Compose. Isso mostra que você está empenhado em melhorar suas habilidades no desenvolvimento Android! Espero que você tenha achado esta postagem do blog útil! Se você gostou deste artigo, pode conferir meus outros artigos clicando aqui . Como sempre, gostaria de agradecer por reservar um tempo para ler este artigo. Te desejo muita sorte! Feliz codificação ‍! Saúde!