SlideShare une entreprise Scribd logo
1  sur  20
Télécharger pour lire hors ligne
Annotation Span Para Estilização de
Texto no Android
thiengo.com.br
Por que utilizar Annotation se podemos utilizar tags HTML?
Excelente pergunta. Realmente podemos utilizar HTML, mas há limitações, pois não
são todas as tags HTML que são interpretadas quando as utilizando em arquivos de
String, arquivos XML que serão necessários principalmente na internacionalização do
aplicativo Android.
As Annotation Span entram em cena quando uma estilização em texto estático é
necessária e as tags HTML suportadas não dão conta de fornecer o estilo apropriado.
Mas eu poderia trabalhar diretamente com SpannableString, certo?
Sim, você poderia. O problema, mesmo quando não há necessidade de mais de um
arquivo de Strings, é que será necessário o conhecimento dos posicionamentos dos
trechos de textos que precisam ser estilizados, algo dispensável quando utilizando
Annotation Span, pois os posicionamentos são obtidos em tempo de execução por
métodos fornecidos pela API.
Essa necessidade de conhecimento dos posicionamentos se torna algo crítico quando
mais de um arquivo de Strings passa a ser necessário ou quando o único arquivo de
Strings precisa passar por atualização de texto, as posições utilizadas em código
como "hard-coded" deverão ser atualizadas, algo que atrapalha a evolução de
qualquer projeto de software.
Tags HTML suportadas em código estático
Para que você não queira sempre utilizar a Annotation Span, até porque o código dela e menos simples do que
quando utilizando tags HTML, a seguir deixo todas as tags HTML de estilo suportadas em arquivos Android de
Strings:
• <b> para negrito;
• <i> para itálico;
• <big> para um texto 25% maior do que o tamanho aplicado ao conjunto;
• <small> para um texto 20% menor do que o tamanho aplicado ao conjunto;
• <font> para um texto com cor distinta (em hexadecimal e utilizando o atributo color) ou com uma família
de fontes distinta (utilizando o atributo face com algum dos possíveis valores: serif, sans_serif e
monospace);
• <tt> para um texto em monospace;
• <strike> para um texto com uma linha no meio;
• <u> para um texto sublinhado;
• <sup> para um texto em linha superior;
• <sub> para um texto em linha inferior.
Se você for estudar também os links de fontes que coloquei neste conjunto de slides (e no artigo destes slides),
notará que em um deles, mais precisamente o artigo da Florina Muntenescu, do Google Android Developers, há
ainda mais tags HTML de estilo que são suportadas, digo, que é informado que são suportadas.
Mas quando testando em código, para tags de estilo, somente as que citei anteriormente é que funcionam.
Tags HTML de estilo em execução
A seguir um código XML, strings.xml, com algumas configurações de tag HTML de estilo
em uso:
Note que <![CDATA[...]]> é utilizado para escapar os símbolos de tag <>.
Executando o aplicativo Android com o código anterior, aplicando cada String a um
TextView, temos:
Annotation Span
Uma tag Annotation é formada por: <annotation key="value">. É isso mesmo, o
conhecido key="value".
Você pode utilizar o rótulo que quiser para a key (chave), mas seguindo as
restrições de nome que temos para variáveis em código dinâmico: nada de
espaços em branco ou acentuação.
Para value (valor), qualquer valor pode ser utilizado, mas esse sempre será tratado
em código como String.
Arquivos com annotation
A seguir temos um arquivo de Strings, /res/values/strings.xml, que representa o
idioma padrão do aparelho de testes, aqui um device em português do Brasil:
Então o arquivo de Strings, /res/values-en/strings.xml, que representa o idioma inglês
para aparelhos tendo está língua como padrão:
Note que não há problemas em utilizar ao mesmo tempo tags HTML de estilo e tags
<annotation>.
A definição key="value" para o exemplo é: fontFamily="nome da família de fonte".
Como estaremos utilizando uma família de fonte não padrão, a melhor escolha foi o
uso de Annotation Span (a tag <annotation> é uma Span - abreviação de Spanned).
Em resumo: uma Span permite a aplicação de estilos em String.
Aplicando estilos de acordo com as annotation tags
Agora é preciso, em código dinâmico, identificar as annotations e então aplicar os
estilos corretos.
É importante assumir que temos duas fontes extras em /res/font. São elas:
• cinzel.ttf;
• e fredoka_one.ttf.
Para saber mais sobre fonts in XML no Android, acesse Fontes em XML, Android
O. Configuração e Uso.
Assim o código que aplica os estilos, famílias de fontes (leia todos os comentários):
Note como os text.getSpanStart( annotation ) e text.getSpanEnd( annotation )
permitem que nós desenvolvedores não tenhamos de gravar em código os
posicionamentos dos textos que terão de ser estilizados. Este é um grande ganho
em relação a utilizar diretamente, e somente, objetos Spanned em código
dinâmico.
Você deve estar se perguntando sobre a classe CustomTypefaceSpan, certo?
Essa é uma classe hackcode criada para ser possível a definição de família de
fonte em uma String Spanned, segue o boilerplate code dela:
Está classe também esta presente no artigo de fonts in XML indicado anteriormente.
Executando o projeto, primeiro com o aparelho no idioma configurado em português
e depois modificando o idioma para inglês, temos:
Conteúdos importantes
Para tirar o máximo do conteúdo sobre Annotation Span, fortemente recomendo
que ao final do estudo deste conjunto de slides você estude também os artigos dos
links a seguir, todos sobre famílias de fontes e estilização de Strings no Android:
• Como Utilizar Spannable no Android Para Customizar Strings;
• Fontes em XML, Android O. Configuração e Uso;
• Definindo Fontes em Trechos Não Triviais do Android.
Ponto negativo
• Tags <annotation> têm a limitação de aceitarem somente um par
key="value". Poderia aceitar mais, evitando o uso de mais de uma
<annotation> para um mesmo trecho de texto estático, por exemplo.
Ponto positivo
• Ganho considerável, em código dinâmico, pela não necessidade de
conhecimento prévio das posições dos trechos de textos que devem ser
estilizados.
Considerações finais
Quando há a necessidade de trabalho com Spanned String em texto estático,
mesmo que ainda não havendo necessidade de mais de um idioma em projeto
Android, o uso de tags <annotation> trará maior eficiência principalmente na
atualização de código, de textos em strings.xml.
Isso, pois o conhecimento prévio do posicionamento dos textos que têm de receber
estilos complexos não será necessário, as APIs de Annotation permitem o fácil
acesso às posições.
Fontes
Conteúdo completo, em texto e em vídeo, no link a seguir:
• Annotation Span para Estilização de Texto no Android.
Fontes:
• Styling internationalized text in Android;
• AnnotationSpans – Part 1;
• Language and locale resolution overview;
• Get font resource from TypedArray before API 26 - Resposta de Tom;
• Display Back Arrow on Toolbar - Resposta de MrEngineer13 e de Brais
Gabin;
• Set drawable for DividerItemDecoration;
• Reference one string from another string in strings.xml? - Resposta de
Beeing Jk e de Joseph Garrone.
Para estudo
• Treinamento oficial:
• Prototipagem Profissional de Aplicativos Android.
• Meus livros:
• Desenvolvedor Kotlin Android - Bibliotecas para o dia a dia;
• Receitas Para Desenvolvedores Android;
• Refatorando Para Programas Limpos.
• Redes:
• Udemy;
• YouTube;
• Facebook;
• LinkedIn;
• GitHub;
• Twitter;
• Google Plus.
• Blog App.
Annotation Span Para Estilização de
Texto no Android
thiengo.com.br
Vinícius Thiengo
thiengocalopsita@gmail.com

Contenu connexe

Tendances

Estudando Android - Lista de Conteúdos do Blog
Estudando Android - Lista de Conteúdos do BlogEstudando Android - Lista de Conteúdos do Blog
Estudando Android - Lista de Conteúdos do BlogVinícius Thiengo
 
Android About Page API Para Construir a Tela Sobre
Android About Page API Para Construir a Tela SobreAndroid About Page API Para Construir a Tela Sobre
Android About Page API Para Construir a Tela SobreVinícius Thiengo
 
PhotoView Android Para a Completa Implementação de Zoom
PhotoView Android Para a Completa Implementação de ZoomPhotoView Android Para a Completa Implementação de Zoom
PhotoView Android Para a Completa Implementação de ZoomVinícius Thiengo
 
Como Utilizar Métodos Binding Adapter no Android
Como Utilizar Métodos Binding Adapter no AndroidComo Utilizar Métodos Binding Adapter no Android
Como Utilizar Métodos Binding Adapter no AndroidVinícius Thiengo
 
BottomNavigationView Android, Como e Quando Utilizar
BottomNavigationView Android, Como e Quando UtilizarBottomNavigationView Android, Como e Quando Utilizar
BottomNavigationView Android, Como e Quando UtilizarVinícius Thiengo
 
ViewModel Android, Como Utilizar Este Componente de Arquitetura
ViewModel Android, Como Utilizar Este Componente de ArquiteturaViewModel Android, Como Utilizar Este Componente de Arquitetura
ViewModel Android, Como Utilizar Este Componente de ArquiteturaVinícius Thiengo
 
Data Binding Para Vinculo de Dados na UI Android
Data Binding Para Vinculo de Dados na UI AndroidData Binding Para Vinculo de Dados na UI Android
Data Binding Para Vinculo de Dados na UI AndroidVinícius Thiengo
 
Android: Qual Tecnologia de Desenvolvimento Utilizar?
Android: Qual Tecnologia de Desenvolvimento Utilizar?Android: Qual Tecnologia de Desenvolvimento Utilizar?
Android: Qual Tecnologia de Desenvolvimento Utilizar?Vinícius Thiengo
 
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...JP Clementi
 
Trabalhando Análise Qualitativa em seu Aplicativo Android
Trabalhando Análise Qualitativa em seu Aplicativo AndroidTrabalhando Análise Qualitativa em seu Aplicativo Android
Trabalhando Análise Qualitativa em seu Aplicativo AndroidVinícius Thiengo
 
CakePHP + Adobe Flex®, v2
CakePHP + Adobe Flex®, v2CakePHP + Adobe Flex®, v2
CakePHP + Adobe Flex®, v2Cauan Cabral
 
Observable Binding Para Atualização na UI Android
Observable Binding Para Atualização na UI AndroidObservable Binding Para Atualização na UI Android
Observable Binding Para Atualização na UI AndroidVinícius Thiengo
 
Java Fx Guia De IntroduçãO
Java Fx Guia De IntroduçãOJava Fx Guia De IntroduçãO
Java Fx Guia De IntroduçãOdanielfc
 
Seu framework é melhor pra quê?
Seu framework é melhor pra quê?Seu framework é melhor pra quê?
Seu framework é melhor pra quê?Jaime Neto
 
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?Erick L. F.
 
Tipos de automação de teste
Tipos de automação de testeTipos de automação de teste
Tipos de automação de testeMarcos Pessoa
 
Programação Android - Básico
Programação Android - BásicoProgramação Android - Básico
Programação Android - BásicoHugoDalevedove
 
Html - capitulo 06
Html - capitulo 06Html - capitulo 06
Html - capitulo 06Alvaro Gomes
 

Tendances (20)

Estudando Android - Lista de Conteúdos do Blog
Estudando Android - Lista de Conteúdos do BlogEstudando Android - Lista de Conteúdos do Blog
Estudando Android - Lista de Conteúdos do Blog
 
Android About Page API Para Construir a Tela Sobre
Android About Page API Para Construir a Tela SobreAndroid About Page API Para Construir a Tela Sobre
Android About Page API Para Construir a Tela Sobre
 
PhotoView Android Para a Completa Implementação de Zoom
PhotoView Android Para a Completa Implementação de ZoomPhotoView Android Para a Completa Implementação de Zoom
PhotoView Android Para a Completa Implementação de Zoom
 
Como Utilizar Métodos Binding Adapter no Android
Como Utilizar Métodos Binding Adapter no AndroidComo Utilizar Métodos Binding Adapter no Android
Como Utilizar Métodos Binding Adapter no Android
 
BottomNavigationView Android, Como e Quando Utilizar
BottomNavigationView Android, Como e Quando UtilizarBottomNavigationView Android, Como e Quando Utilizar
BottomNavigationView Android, Como e Quando Utilizar
 
ViewModel Android, Como Utilizar Este Componente de Arquitetura
ViewModel Android, Como Utilizar Este Componente de ArquiteturaViewModel Android, Como Utilizar Este Componente de Arquitetura
ViewModel Android, Como Utilizar Este Componente de Arquitetura
 
Data Binding Para Vinculo de Dados na UI Android
Data Binding Para Vinculo de Dados na UI AndroidData Binding Para Vinculo de Dados na UI Android
Data Binding Para Vinculo de Dados na UI Android
 
Html capitulo 07
Html   capitulo 07Html   capitulo 07
Html capitulo 07
 
Android: Qual Tecnologia de Desenvolvimento Utilizar?
Android: Qual Tecnologia de Desenvolvimento Utilizar?Android: Qual Tecnologia de Desenvolvimento Utilizar?
Android: Qual Tecnologia de Desenvolvimento Utilizar?
 
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...
TechEd Brasil 2010 - Dicas, truques do Visual Studio 2010 e novas funcionalid...
 
Trabalhando Análise Qualitativa em seu Aplicativo Android
Trabalhando Análise Qualitativa em seu Aplicativo AndroidTrabalhando Análise Qualitativa em seu Aplicativo Android
Trabalhando Análise Qualitativa em seu Aplicativo Android
 
CakePHP + Adobe Flex®, v2
CakePHP + Adobe Flex®, v2CakePHP + Adobe Flex®, v2
CakePHP + Adobe Flex®, v2
 
Observable Binding Para Atualização na UI Android
Observable Binding Para Atualização na UI AndroidObservable Binding Para Atualização na UI Android
Observable Binding Para Atualização na UI Android
 
Java Fx Guia De IntroduçãO
Java Fx Guia De IntroduçãOJava Fx Guia De IntroduçãO
Java Fx Guia De IntroduçãO
 
Seu framework é melhor pra quê?
Seu framework é melhor pra quê?Seu framework é melhor pra quê?
Seu framework é melhor pra quê?
 
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?
Curso de C/C++ - #Aula 06 - Como é formada a linguagem C ?
 
Tipos de automação de teste
Tipos de automação de testeTipos de automação de teste
Tipos de automação de teste
 
PHP + Flex
PHP + FlexPHP + Flex
PHP + Flex
 
Programação Android - Básico
Programação Android - BásicoProgramação Android - Básico
Programação Android - Básico
 
Html - capitulo 06
Html - capitulo 06Html - capitulo 06
Html - capitulo 06
 

Similaire à Annotation Span Para Estilização de Texto no Android

Introdução à Linguagem de Programação GO
Introdução à Linguagem de Programação GOIntrodução à Linguagem de Programação GO
Introdução à Linguagem de Programação GOJose Augusto Cintra
 
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modelo
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modeloTutotrial de ABNT e WORD: como formatar documento e criar arquivos modelo
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modeloKamir Gemal
 
Boas práticas de programação em C# .NET
Boas práticas de programação em C# .NETBoas práticas de programação em C# .NET
Boas práticas de programação em C# .NETFabiano Roman Beraldi
 
Construindo sites com css e (x)html em pdf
Construindo sites com css e (x)html em pdfConstruindo sites com css e (x)html em pdf
Construindo sites com css e (x)html em pdfWilton Jr
 
Traduções no WordPress
Traduções no WordPressTraduções no WordPress
Traduções no WordPressBreno Alves
 
Apostila linguagem c
Apostila linguagem cApostila linguagem c
Apostila linguagem corvel
 
Criando Símbolos Otimizados para Projetos no InduSoft Web Studio
Criando Símbolos Otimizados para Projetos no InduSoft Web StudioCriando Símbolos Otimizados para Projetos no InduSoft Web Studio
Criando Símbolos Otimizados para Projetos no InduSoft Web StudioAVEVA
 
Robot Framework - principais características
Robot Framework - principais característicasRobot Framework - principais características
Robot Framework - principais característicasalinebiath
 
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Uni Buscapé Company
 
Benef&iacute;cios dos WebStandards
Benef&iacute;cios dos WebStandardsBenef&iacute;cios dos WebStandards
Benef&iacute;cios dos WebStandardsNáiron Jcg
 

Similaire à Annotation Span Para Estilização de Texto no Android (20)

Introdução à Linguagem de Programação GO
Introdução à Linguagem de Programação GOIntrodução à Linguagem de Programação GO
Introdução à Linguagem de Programação GO
 
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modelo
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modeloTutotrial de ABNT e WORD: como formatar documento e criar arquivos modelo
Tutotrial de ABNT e WORD: como formatar documento e criar arquivos modelo
 
Boas práticas de programação em C# .NET
Boas práticas de programação em C# .NETBoas práticas de programação em C# .NET
Boas práticas de programação em C# .NET
 
Construindo sites com css e (x)html em pdf
Construindo sites com css e (x)html em pdfConstruindo sites com css e (x)html em pdf
Construindo sites com css e (x)html em pdf
 
Aula1
Aula1Aula1
Aula1
 
Traduções no WordPress
Traduções no WordPressTraduções no WordPress
Traduções no WordPress
 
Compiladores
CompiladoresCompiladores
Compiladores
 
Escalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLIDEscalando apps com React e Type Script e SOLID
Escalando apps com React e Type Script e SOLID
 
Css e iFrames
Css e iFramesCss e iFrames
Css e iFrames
 
Apostila linguagem c
Apostila linguagem cApostila linguagem c
Apostila linguagem c
 
Aula 04
Aula 04Aula 04
Aula 04
 
Apostila linguagem c
Apostila linguagem cApostila linguagem c
Apostila linguagem c
 
Criando Símbolos Otimizados para Projetos no InduSoft Web Studio
Criando Símbolos Otimizados para Projetos no InduSoft Web StudioCriando Símbolos Otimizados para Projetos no InduSoft Web Studio
Criando Símbolos Otimizados para Projetos no InduSoft Web Studio
 
15. introducao ao c++
15. introducao ao c++15. introducao ao c++
15. introducao ao c++
 
3844 css
3844 css3844 css
3844 css
 
Robot Framework - principais características
Robot Framework - principais característicasRobot Framework - principais características
Robot Framework - principais características
 
Html 01
Html 01Html 01
Html 01
 
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
Apresentação do Curso Primeiros Passos na Web com HTML e CSS - Profite e Univ...
 
Aula 03
Aula 03Aula 03
Aula 03
 
Benef&iacute;cios dos WebStandards
Benef&iacute;cios dos WebStandardsBenef&iacute;cios dos WebStandards
Benef&iacute;cios dos WebStandards
 

Plus de Vinícius Thiengo

7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler
7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler
7 Livros Que Não São de TI, Mas Que Um Programador Deveria LerVinícius Thiengo
 
5 livros que não são de TI, mas que um desenvolvedor deveria ler
5 livros que não são de TI, mas que um desenvolvedor deveria ler5 livros que não são de TI, mas que um desenvolvedor deveria ler
5 livros que não são de TI, mas que um desenvolvedor deveria lerVinícius Thiengo
 
Lottie API Para Animações no Android
Lottie API Para Animações no AndroidLottie API Para Animações no Android
Lottie API Para Animações no AndroidVinícius Thiengo
 
True Time API Para Data e Horário NTP no Android
True Time API Para Data e Horário NTP no AndroidTrue Time API Para Data e Horário NTP no Android
True Time API Para Data e Horário NTP no AndroidVinícius Thiengo
 
Utilizando Intenções Para Mapas de Alta Qualidade no Android
Utilizando Intenções Para Mapas de Alta Qualidade no AndroidUtilizando Intenções Para Mapas de Alta Qualidade no Android
Utilizando Intenções Para Mapas de Alta Qualidade no AndroidVinícius Thiengo
 
Leitor de Códigos no Android com Barcode Scanner API - ZXing
Leitor de Códigos no Android com Barcode Scanner API - ZXingLeitor de Códigos no Android com Barcode Scanner API - ZXing
Leitor de Códigos no Android com Barcode Scanner API - ZXingVinícius Thiengo
 
Como Reter Objetos Utilizando Android-State API
Como Reter Objetos Utilizando Android-State APIComo Reter Objetos Utilizando Android-State API
Como Reter Objetos Utilizando Android-State APIVinícius Thiengo
 
Chips Android, Quando e Como Utilizar
Chips Android, Quando e Como UtilizarChips Android, Quando e Como Utilizar
Chips Android, Quando e Como UtilizarVinícius Thiengo
 
Android: Avaliação do Pré-projeto Agenda Cultural
Android: Avaliação do Pré-projeto Agenda CulturalAndroid: Avaliação do Pré-projeto Agenda Cultural
Android: Avaliação do Pré-projeto Agenda CulturalVinícius Thiengo
 

Plus de Vinícius Thiengo (11)

7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler
7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler
7 Livros Que Não São de TI, Mas Que Um Programador Deveria Ler
 
5 livros que não são de TI, mas que um desenvolvedor deveria ler
5 livros que não são de TI, mas que um desenvolvedor deveria ler5 livros que não são de TI, mas que um desenvolvedor deveria ler
5 livros que não são de TI, mas que um desenvolvedor deveria ler
 
Lottie API Para Animações no Android
Lottie API Para Animações no AndroidLottie API Para Animações no Android
Lottie API Para Animações no Android
 
True Time API Para Data e Horário NTP no Android
True Time API Para Data e Horário NTP no AndroidTrue Time API Para Data e Horário NTP no Android
True Time API Para Data e Horário NTP no Android
 
Utilizando Intenções Para Mapas de Alta Qualidade no Android
Utilizando Intenções Para Mapas de Alta Qualidade no AndroidUtilizando Intenções Para Mapas de Alta Qualidade no Android
Utilizando Intenções Para Mapas de Alta Qualidade no Android
 
Leitor de Códigos no Android com Barcode Scanner API - ZXing
Leitor de Códigos no Android com Barcode Scanner API - ZXingLeitor de Códigos no Android com Barcode Scanner API - ZXing
Leitor de Códigos no Android com Barcode Scanner API - ZXing
 
Como Reter Objetos Utilizando Android-State API
Como Reter Objetos Utilizando Android-State APIComo Reter Objetos Utilizando Android-State API
Como Reter Objetos Utilizando Android-State API
 
Chips Android, Quando e Como Utilizar
Chips Android, Quando e Como UtilizarChips Android, Quando e Como Utilizar
Chips Android, Quando e Como Utilizar
 
Android: Avaliação do Pré-projeto Agenda Cultural
Android: Avaliação do Pré-projeto Agenda CulturalAndroid: Avaliação do Pré-projeto Agenda Cultural
Android: Avaliação do Pré-projeto Agenda Cultural
 
Freelancer Android
Freelancer AndroidFreelancer Android
Freelancer Android
 
Material Design
Material DesignMaterial Design
Material Design
 

Dernier

Educação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptxEducação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptxMarcosLemes28
 
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...marcelafinkler
 
3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptxMarlene Cunhada
 
Plano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptxPlano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptxPaulaYaraDaasPedro
 
Artigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.pptArtigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.pptRogrioGonalves41
 
Pesquisa Ação René Barbier Livro acadêmico
Pesquisa Ação René Barbier Livro  acadêmicoPesquisa Ação René Barbier Livro  acadêmico
Pesquisa Ação René Barbier Livro acadêmicolourivalcaburite
 
Renascimento Cultural na Idade Moderna PDF
Renascimento Cultural na Idade Moderna PDFRenascimento Cultural na Idade Moderna PDF
Renascimento Cultural na Idade Moderna PDFRafaelaMartins72608
 
Conflitos entre: ISRAEL E PALESTINA.pdf
Conflitos entre:  ISRAEL E PALESTINA.pdfConflitos entre:  ISRAEL E PALESTINA.pdf
Conflitos entre: ISRAEL E PALESTINA.pdfjacquescardosodias
 
Expansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVExpansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVlenapinto
 
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de LedAula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de LedJaquelineBertagliaCe
 
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...O estudo do controle motor nada mais é do que o estudo da natureza do movimen...
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...azulassessoria9
 
8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeitotatianehilda
 
O que é arte. Definição de arte. História da arte.
O que é arte. Definição de arte. História da arte.O que é arte. Definição de arte. História da arte.
O que é arte. Definição de arte. História da arte.denisecompasso2
 
Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024Cabiamar
 
aula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.pptaula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.pptssuser2b53fe
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdfmarlene54545
 
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...DirceuNascimento5
 
M0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxM0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxJustinoTeixeira1
 
LENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLidianePaulaValezi
 
6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptxJssicaCassiano2
 

Dernier (20)

Educação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptxEducação Financeira - Cartão de crédito665933.pptx
Educação Financeira - Cartão de crédito665933.pptx
 
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
Introdução às Funções 9º ano: Diagrama de flexas, Valor numérico de uma funçã...
 
3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx
 
Plano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptxPlano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptx
 
Artigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.pptArtigo Científico - Estrutura e Formatação.ppt
Artigo Científico - Estrutura e Formatação.ppt
 
Pesquisa Ação René Barbier Livro acadêmico
Pesquisa Ação René Barbier Livro  acadêmicoPesquisa Ação René Barbier Livro  acadêmico
Pesquisa Ação René Barbier Livro acadêmico
 
Renascimento Cultural na Idade Moderna PDF
Renascimento Cultural na Idade Moderna PDFRenascimento Cultural na Idade Moderna PDF
Renascimento Cultural na Idade Moderna PDF
 
Conflitos entre: ISRAEL E PALESTINA.pdf
Conflitos entre:  ISRAEL E PALESTINA.pdfConflitos entre:  ISRAEL E PALESTINA.pdf
Conflitos entre: ISRAEL E PALESTINA.pdf
 
Expansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVExpansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XV
 
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de LedAula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
Aula 67 e 68 Robótica 8º ano Experimentando variações da matriz de Led
 
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...O estudo do controle motor nada mais é do que o estudo da natureza do movimen...
O estudo do controle motor nada mais é do que o estudo da natureza do movimen...
 
8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito8 Aula de predicado verbal e nominal - Predicativo do sujeito
8 Aula de predicado verbal e nominal - Predicativo do sujeito
 
O que é arte. Definição de arte. História da arte.
O que é arte. Definição de arte. História da arte.O que é arte. Definição de arte. História da arte.
O que é arte. Definição de arte. História da arte.
 
Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024Historia de Portugal - Quarto Ano - 2024
Historia de Portugal - Quarto Ano - 2024
 
aula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.pptaula de bioquímica bioquímica dos carboidratos.ppt
aula de bioquímica bioquímica dos carboidratos.ppt
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf
 
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
A Revolução Francesa. Liberdade, Igualdade e Fraternidade são os direitos que...
 
M0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxM0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptx
 
LENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretação
 
6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx
 

Annotation Span Para Estilização de Texto no Android

  • 1. Annotation Span Para Estilização de Texto no Android thiengo.com.br
  • 2. Por que utilizar Annotation se podemos utilizar tags HTML? Excelente pergunta. Realmente podemos utilizar HTML, mas há limitações, pois não são todas as tags HTML que são interpretadas quando as utilizando em arquivos de String, arquivos XML que serão necessários principalmente na internacionalização do aplicativo Android. As Annotation Span entram em cena quando uma estilização em texto estático é necessária e as tags HTML suportadas não dão conta de fornecer o estilo apropriado. Mas eu poderia trabalhar diretamente com SpannableString, certo? Sim, você poderia. O problema, mesmo quando não há necessidade de mais de um arquivo de Strings, é que será necessário o conhecimento dos posicionamentos dos trechos de textos que precisam ser estilizados, algo dispensável quando utilizando Annotation Span, pois os posicionamentos são obtidos em tempo de execução por métodos fornecidos pela API. Essa necessidade de conhecimento dos posicionamentos se torna algo crítico quando mais de um arquivo de Strings passa a ser necessário ou quando o único arquivo de Strings precisa passar por atualização de texto, as posições utilizadas em código como "hard-coded" deverão ser atualizadas, algo que atrapalha a evolução de qualquer projeto de software.
  • 3. Tags HTML suportadas em código estático Para que você não queira sempre utilizar a Annotation Span, até porque o código dela e menos simples do que quando utilizando tags HTML, a seguir deixo todas as tags HTML de estilo suportadas em arquivos Android de Strings: • <b> para negrito; • <i> para itálico; • <big> para um texto 25% maior do que o tamanho aplicado ao conjunto; • <small> para um texto 20% menor do que o tamanho aplicado ao conjunto; • <font> para um texto com cor distinta (em hexadecimal e utilizando o atributo color) ou com uma família de fontes distinta (utilizando o atributo face com algum dos possíveis valores: serif, sans_serif e monospace); • <tt> para um texto em monospace; • <strike> para um texto com uma linha no meio; • <u> para um texto sublinhado; • <sup> para um texto em linha superior; • <sub> para um texto em linha inferior. Se você for estudar também os links de fontes que coloquei neste conjunto de slides (e no artigo destes slides), notará que em um deles, mais precisamente o artigo da Florina Muntenescu, do Google Android Developers, há ainda mais tags HTML de estilo que são suportadas, digo, que é informado que são suportadas. Mas quando testando em código, para tags de estilo, somente as que citei anteriormente é que funcionam.
  • 4. Tags HTML de estilo em execução A seguir um código XML, strings.xml, com algumas configurações de tag HTML de estilo em uso:
  • 5. Note que <![CDATA[...]]> é utilizado para escapar os símbolos de tag <>. Executando o aplicativo Android com o código anterior, aplicando cada String a um TextView, temos:
  • 6. Annotation Span Uma tag Annotation é formada por: <annotation key="value">. É isso mesmo, o conhecido key="value". Você pode utilizar o rótulo que quiser para a key (chave), mas seguindo as restrições de nome que temos para variáveis em código dinâmico: nada de espaços em branco ou acentuação. Para value (valor), qualquer valor pode ser utilizado, mas esse sempre será tratado em código como String.
  • 7. Arquivos com annotation A seguir temos um arquivo de Strings, /res/values/strings.xml, que representa o idioma padrão do aparelho de testes, aqui um device em português do Brasil:
  • 8. Então o arquivo de Strings, /res/values-en/strings.xml, que representa o idioma inglês para aparelhos tendo está língua como padrão: Note que não há problemas em utilizar ao mesmo tempo tags HTML de estilo e tags <annotation>. A definição key="value" para o exemplo é: fontFamily="nome da família de fonte". Como estaremos utilizando uma família de fonte não padrão, a melhor escolha foi o uso de Annotation Span (a tag <annotation> é uma Span - abreviação de Spanned). Em resumo: uma Span permite a aplicação de estilos em String.
  • 9. Aplicando estilos de acordo com as annotation tags Agora é preciso, em código dinâmico, identificar as annotations e então aplicar os estilos corretos. É importante assumir que temos duas fontes extras em /res/font. São elas: • cinzel.ttf; • e fredoka_one.ttf. Para saber mais sobre fonts in XML no Android, acesse Fontes em XML, Android O. Configuração e Uso. Assim o código que aplica os estilos, famílias de fontes (leia todos os comentários):
  • 10.
  • 11. Note como os text.getSpanStart( annotation ) e text.getSpanEnd( annotation ) permitem que nós desenvolvedores não tenhamos de gravar em código os posicionamentos dos textos que terão de ser estilizados. Este é um grande ganho em relação a utilizar diretamente, e somente, objetos Spanned em código dinâmico. Você deve estar se perguntando sobre a classe CustomTypefaceSpan, certo? Essa é uma classe hackcode criada para ser possível a definição de família de fonte em uma String Spanned, segue o boilerplate code dela:
  • 12.
  • 13. Está classe também esta presente no artigo de fonts in XML indicado anteriormente. Executando o projeto, primeiro com o aparelho no idioma configurado em português e depois modificando o idioma para inglês, temos:
  • 14. Conteúdos importantes Para tirar o máximo do conteúdo sobre Annotation Span, fortemente recomendo que ao final do estudo deste conjunto de slides você estude também os artigos dos links a seguir, todos sobre famílias de fontes e estilização de Strings no Android: • Como Utilizar Spannable no Android Para Customizar Strings; • Fontes em XML, Android O. Configuração e Uso; • Definindo Fontes em Trechos Não Triviais do Android.
  • 15. Ponto negativo • Tags <annotation> têm a limitação de aceitarem somente um par key="value". Poderia aceitar mais, evitando o uso de mais de uma <annotation> para um mesmo trecho de texto estático, por exemplo.
  • 16. Ponto positivo • Ganho considerável, em código dinâmico, pela não necessidade de conhecimento prévio das posições dos trechos de textos que devem ser estilizados.
  • 17. Considerações finais Quando há a necessidade de trabalho com Spanned String em texto estático, mesmo que ainda não havendo necessidade de mais de um idioma em projeto Android, o uso de tags <annotation> trará maior eficiência principalmente na atualização de código, de textos em strings.xml. Isso, pois o conhecimento prévio do posicionamento dos textos que têm de receber estilos complexos não será necessário, as APIs de Annotation permitem o fácil acesso às posições.
  • 18. Fontes Conteúdo completo, em texto e em vídeo, no link a seguir: • Annotation Span para Estilização de Texto no Android. Fontes: • Styling internationalized text in Android; • AnnotationSpans – Part 1; • Language and locale resolution overview; • Get font resource from TypedArray before API 26 - Resposta de Tom; • Display Back Arrow on Toolbar - Resposta de MrEngineer13 e de Brais Gabin; • Set drawable for DividerItemDecoration; • Reference one string from another string in strings.xml? - Resposta de Beeing Jk e de Joseph Garrone.
  • 19. Para estudo • Treinamento oficial: • Prototipagem Profissional de Aplicativos Android. • Meus livros: • Desenvolvedor Kotlin Android - Bibliotecas para o dia a dia; • Receitas Para Desenvolvedores Android; • Refatorando Para Programas Limpos. • Redes: • Udemy; • YouTube; • Facebook; • LinkedIn; • GitHub; • Twitter; • Google Plus. • Blog App.
  • 20. Annotation Span Para Estilização de Texto no Android thiengo.com.br Vinícius Thiengo thiengocalopsita@gmail.com