Xamarin Forms | Fontes customizadas e Attributos de fontes
Já precisou utilizar uma fonte, que não existia no sistema operacional, de alguma aplicação Xamarin Forms?
Hoje vou abordar como podemos aplicar uma fonte customizada e defini-la como Bold, Italic e etc…
Caso você utilize o Xamarin.Forms na versão 4.5, ou superior, recomendo que você veja esse meu outro artigo sobre o novo modo de utilização de fontes:
Pesquisando fontes
Partindo do principio de que você precisa ainda encontrar uma fonte, para poder trabalhar, vou sugerir o banco do GoogleFonts.
Além de um acervo gigante, o site nos abre muitas ferramentas interessantes para criar uma boa experiência na busca.
Para esse exemplo, vou utilizar uma fonte chamada Orbitron.
Agora vamos baixá-la.
Após o download, vamos extrair o conteúdo do arquivo compactado e, para esse exemplo, utilizaremos as fontes com sufixo “Regular” e “Bold”.
Importando fontes no Android
Para o projeto Android, tudo que precisamos fazer é, incluir os arquivos de fonte na pasta Assets e garantir que a ação de compilação seja AndroidAsset.
Importando fontes no IOS
Para o projeto IOS, vamos incluir os arquivos de fonte na pasta Resources e garantir que a ação de compilação seja BundleResource.
E também precisamos atualizar o arquivo Info.plist, incluindo as fontes na propriedade UIAppFonts.
Utilizando as fontes no Xamarin.Forms
Agora, vamos utilizar o OnPlatform para informar ao Xamarin como encontrar nossa fonte corretamente.
O padrão para o nome da fonte é {NomeDoArquivo#Titulo da fonte}, para o Android, enquanto basta utilizarmos o nome do arquivo para o IOS
Muito legal mas, e se eu quiser utilizar FontAttributes=”Bold” ?
Aí a brincadeira começa a ficar interessante!
Alterando atributos de fontes no Xamarin.Forms
Podemos definir a utilização da fonte Bold ao alterar o arquivo utilizado.
Caso você dependa de algo dinâmico, para trocar em tempo de execução, baseado no FontAttributes, podemos utilizar uma ferramenta chamada Trigger.
Com Triggers, podemos definir um gatilho especifico para executar uma acão especifica, de forma bem simples.
Basicamente quando FontAttributes mudar para Bold, o Trigger vai disparar definindo um novo arquivo para o FontFamily.
Mas e se eu quiser utilizar o Trigger e a fonte em mais de um Label, vou ter que escrever tudo isso de novo?
É importante que a gente centralize os estilos de nossas aplicações xamarin, para que consigamos reaproveitar definições, evitemos de esquecer quaisquer mudanças em algum controle e possibilitar uma facilidade para alterações no futuro.
Deixamos tudo relacionado à estilizaçao dos controles, centralizado e reaproveitável.
Também podemos aplicar essa centralização com o exemplo dinâmico fazendo varios controles utilizarem estilos e fazer com que fonte e Trigger.
Importante! Sempre que possível opte pela opção estática, pois apis dinâmicas (como o trigger) sempre vem com algum custo. Logo, precisamos avaliar a real necessidade de implementá-las.
Note que separei o OnPlatform de cada arquivo de fonte, dessa forma posso reaproveitar essa lógica caso crie estilo de um outro controle que possua FontFamily, como o botão por exemplo.
Resultado
Rodando o projeto, conseguiremos ver que a fonte foi aplicada corretamente e, utilizando o HotReload (já agradeceu aos Deuses do HotReload hoje?) podemos ver a mágica acontecendo.
O código completo do projeto você encontra no Github:
