10 Dicas de Produtividade no Flutter utilizando Android Studio
Produzir mais em menos tempo de forma eficaz é sempre uma questão relevante quando se trata do processo de trabalho, seja pra cumprir o deadline de um projeto pessoal ou para entregar a um cliente.
Pensando nisso, separei algumas dicas e atalhos muito úteis que iremos abordar neste artigo, pra agilizar nosso processo no desenvolvimento de um determinado produto.
Mas antes, vamos falar um pouco do surgimento dessa IDE amplamente utilizada hoje em dia.
Então, como surgiu o Android Studio?
Anunciado durante a Google I/O de 2013, o Android Studio é um Ambiente de Desenvolvimento Integrado (IDE, na sigla em inglês) que utiliza a base da IDE IntelliJ, que foi desenvolvida pelo pessoal da JetBrains.
A partir do lançamento, várias versões foram incrementadas desde 2013, e hoje em dia é amplamente utilizado no mercado de trabalho, um projeto open-source que muitos desenvolvedores contribuem bastante adicionando plugins e extensões.
Indo direto ao ponto…
As dicas e atalhos que abordaremos aqui, utilizo-as diariamente em meus projetos relacionados a flutter ou desenvolvimento nativo (quando se aplicam).
O link para download da IDE encontra-se clicando aqui. No momento da criação deste artigo, encontra-se na versão 3.5.
Serão apresentadas aqui dicas simples que muitos podem até conhecer, mas que são bastante úteis.
1. Duplicar linha de forma simples
Um atalho interessante é que podemos duplicar a linha apenas colocando o cursor no final da mesma, e apertando a tecla CTRL+D. Evitando assim ter que utilizar sempre o CTRL+C e CTRL+V, como demonstrado abaixo:
Da mesma forma, você pode cortar uma linha e colar em outro local do código. Com o cursor no final da linha, aperte CTRL+X para recortar sem a necessidade de selecionar todo o conteúdo dela, pra depois cortar.
O atalho é conferido no exemplo abaixo:
2. Verificando as propriedades de um determinado widget
Geralmente quando necessitamos analisar o widget, utilizamos a documentação do flutter pra obter informações sobre o mesmo. Porém, podemos fazer isso diretamente da IDE clicando em cima do widget e apertando as teclas CTRL+SHIFT+I, como no exemplo abaixo:
3. Utilizando a IDE para inspecionar o código
Um caminho simples mas que muito desenvolvedor desconhece, é a parte de inspeção do código. Siga o caminho Analyze > Inspect Code… e na janela que abrir, deixe selecionado Whole project e clique em OK.
Após isso, na barra de ferramentas irá aparecer uma aba chamada Inspection Results, mostrando os resultados da inspeção de código (como por exemplo erros na lógica, import’s sem uso, erros de sintaxe, etc).
4. Identar o código
Muitas IDE’s possuem essa funcionalidade, que se resume em um atalho simples e rápido para identar o código (organizar-lo esteticamente).
Clique em qualquer parte do código e pressione as teclas CTRL+ALT+L:
5. Remover import’s sem uso
A depender do tamanho do aplicativo, pode ser que sejam utilizados muitos import’s que a medida que o código for melhorado, eles sejam inutilizados. Remova todos os import’s que estejam sem uso no código, pressionando apenas as teclas CTRL+ALT+O.
6. Stateful ou Stateless?
Não abordaremos com detalhes o significado e as funcionalidades de cada um, mas neste link encontra-se um ótimo artigo aos que quiserem ler sobre isso posteriormente.
Para criar os componentes de gerenciamento de estado de forma simples, podemos optar por Stateful ou Stateless. Podemos fazer essa criação dos nossos componentes de forma simples.
Utilizando o atalho stf para Stateful, como no exemplo abaixo:
Ou utilizando o atalho stless para Stateless, como no exemplo abaixo:
7. Analisando usos de uma classe/método
Esse recurso é muito útil principalmente em projetos grandes, quando necessitamos saber se uma determinada classe/método está sendo utilizada no código e exatamente o local.
Clique com o botão direito no nome da classe ou do método e clique em Find Usages ou simplesmente pressione o atalho ALT+F7.
O retorno virá na barra de ferramentas, na aba Find. Onde irá trazer os resultados pra análise, e mostrará o caminho exatamente onde está sendo utilizado, como na imagem abaixo:
8. Incluindo um widget dentro de outro
No processo de construção do layout, realizamos diversos testes aninhando os widgets, até chegar em uma solução ideal.
Clique em cima de um widget e pressione o atalho ALT+ENTER, serão exibidas diversas opções para incluir o widget dentro de uma Column ou centralizar esse widget, por exemplo.
9. Obtendo informações de um widget
Quando necessitamos buscar informações sobre um determinado widget, utilizamos a documentação do flutter. Porém, há uma forma de obter as mesmas informações de forma resumida pela IDE, clicando em cima do widget e utilizando a tecla de atalho CTRL+Q.
10. Buscando rapidamente um arquivo ou classe
Uma forma simples e rápida de realizar busca por nomes de arquivos ou classes, é utilizando o atalho CTRL+N. Ao pressionar, irá abrir uma caixa de pesquisa para digitar o conteúdo da sua busca:
BÔNUS
Como estamos falando sobre produtividade, deixo aqui um site muito intuitivo para converter um JSON de forma rápida em uma classe em Dart.
O site é o JSON to Dart, criado pelo usuário @javiercbk. Apenas cole o conteúdo do JSON e a ferramenta irá lhe retornar a classe completa:
É muito útil quando precisamos criar um model de um retorno de uma determinada API, e pra não ter que digitar tudo na mão, geralmente utilizo o site que indiquei acima.
Give me a cup of coffee!
Depois de todas essas dicas, que tal preparar um pouco de café e começar a colocar todas essas dicas e atalhos em prática?
Se as dicas foram interessantes pra você, não deixe de deixar seu aplauso ou “clap” aqui no Medium, e me incentive a criar mais artigos relacionados a desenvolvimento de softwares.
Conecte-se também comigo no LinkedIn, clicando aqui. E siga-me no GitHub clicando no link abaixo:
