Views customizadas no Android - Parte 1

*Esse post foi originalmente publicado no Blog pessoal do autor.

Para implementar uma aplicação típica, o Android disponibiliza uma grande variedade de widgets:

Entretanto, apesar dessa grande quantidade de widgets fornecidos pela plataforma, quase sempre nos deparamos com cenários nos quais o pessoal de UX/UI especificam componentes peculiares que o Android não possui por padrão.

Para construir esses componentes, a maioria dos desenvolvedores não se preocupa com o baixo acoplamento, reuso e alta coesão e acabam construindo e replicando código dentro de Activities ou até mesmo criando Fragments para uma simples View. Isso faz com que eles tenham que lidar com o ciclo de vida dos Fragments:

Ciclo de vida do fragment

Vamos supor que no aplicativo que estamos desenvolvendo teremos que implementar um botão que pisque toda vez que for clicado. Para esse exemplo, vamos usar o retrolambda, que possibilita a utilização de lambda do Java 8 em projetos Android.

A implementação funciona perfeitamente, mas se precisarmos implementar o efeito de piscar outras botões teremos que replicar o código ou criar uma classe utilitária para isso. Além disso, estaremos misturando efeitos visuais com a regra de negócio, o que vai dificultar os testes e a evolução do código.

Qual a solução? Customizar o widget de botão do Android e implementar a funcionalidade de piscar o botão toda vez que for clicado:

Outra opção é criar um agrupamento de Views no Android utilizando o ViewGroup ou classes filhas, como: LinearLayout, RelativeLayout, GridLayout e etc.

Para exemplificar, vamos criar uma view customizada para exibição de valores monetários, na qual o símbolo de moeda tem um tamanho diferente do tamanho definido para o valor e o valor já é inserido formatado (utilizei a biblioteca canarinho) no TextView.

Podemos incluir a MoneyView diretamente no xml correspondente ao layout:

Ou podemos adicionar a MoneyView programaticamente:

E é isso! O projeto de exemplo pode ser encontrado neste repositório do Github. Ficou alguma dúvida ou tem alguma sugestão? Aproveite os campos abaixo!

Na segunda parte desse post, vou mostrar como criar os atributos customizados para que seja possível definir valores para a view customizada direto do xml. Até lá!