Como alterar os ícones dos aplicativos em React Native CLI

Olá pessoal. Finalizando essa parte de desenvolvimento e publicação de projetos baseados em React Native, eu gostaria de mostrar a vocês mais uma etapa importante durante o processo de desenvolvimento, que é a adição de ícones para os nossos aplicativos, e como é possível substituir os ícones que são gerados por padrão nos aplicativos desenvolvidos em React Native para Android de maneira bem simples e rápida, através de um serviço na nuvem que facilita bastante a geração desses artefatos tão importantes que representam uma parte da identidade visual do nosso app. Vamos lá?

Primeiro passo

Antes de começar, é importante que o ícone desenvolvido atenda a alguns requisitos para garantir melhor qualidade visual:

• Ele deve ter aspecto 1:1 e possuir resolução de pelo menos 1024 por 1024 pixels;
• Ele precisa estar no formato PNG, com fundo transparente ou não;
• É recomendável que ele atenda as normas de design estabelecidas pela Google.

Segundo passo

Feito isso, basta acessar a página do projeto Android Asset Studio e importar o seu arquivo de imagem. Lá é possível definir uma imagem, um ícone de clipart ou mesmo um texto como ícone: 

Também é possível realizar alguns ajustes como o espaçamento interno do ícone, cor de fundo, escala, recorte de imagem e contorno, além de alguns efeitos visuais como elevação, sombra e meio tom.

Terceiro passo

Depois de realizar os ajustes necessários, basta clicar no botão de download localizado no canto superior direito:

Ele vai gerar um arquivo compactado no formato ZIP contendo duas imagens em resoluções diferentes que podem ser utilizadas na Play Store durante a publicação do app e uma pasta chamada res:

Dentro desse diretório temos todo o artefato necessário para substituir os ícones lá no projeto.

Quarto passo

Por fim, acessamos a pasta do projeto até o caminho seguinte:

"NomeDoProjeto"/android/app/src/main/res/

e arrastamos as pastas dentro de res geradas para dentro desse diretório:

* Alguns desenvolvedores não recomendam substituir todas as pastas de uma vez. Ao invés disso, eles sugerem substituir arquivo por arquivo dentro de seu respectivo diretório.

Depois de copiar, basta iniciar o projeto, executá-lo de sua preferência e será possível ver a mudança na grade de aplicativos do Android:

Espero que tenha ajudado

Até mais!