DEV Community

Cover image for Ambiente Mobile sem Android Studio
PedroHMoraes
PedroHMoraes

Posted on • Edited on

Ambiente Mobile sem Android Studio

#flutter #android #mobile #sdk

Apesar do mobile estar em alta, demorei para procurar sobre esse mundo. Tenho uma pequena base de React Native mas só agora resolvi estudar Flutter e conhecer essa nova plataforma que tem a "mãozinha" da Google envolvida.
Mas logo de cara me deparei com um sério problema, preparar o ambiente SEM o Android Studio.

E pensando nisso criei esse post com os passos que segui para conseguir fazer funcionar o ambiente mobile sem o Android Studio e receber os checks✔️ do flutter doctor.

OBS:* Nada contra ao Android Studio, acredito que ele seja uma ótima ferramenta, mas prefiro algo mais leve e "moldável", digamos.

Índice

  1. Ambiente Android
  2. Flutter
  3. Variáveis de Ambiente
    1. Android
    2. Path
  4. Android SDK
  5. Licenças do Android
  6. Configurar SDK no Flutter
  7. Emulador
  8. VSCode
  9. Hora da Verdade
  10. Resultado
  11. Fim

Vamos lá!

1º Passo - Ambiente Android

Baixe o pacote com o SDK e o OpenJDK
https://drive.google.com/file/d/1Ew_TVBn1IX_yGgszbx3j2hjGVQjg6oDs/view

Crie a pasta Android na raiz da unidade que queira instalar o ambiente e dentro dela as pastas do OpenJDK e SDK

F:\Android\openjdk
F:\Android\sdk
Enter fullscreen mode Exit fullscreen mode

Extraia o pacote nas suas respectivas pastas.

2º Passo - Flutter

Instale o flutter de acordo com o seu sistema operacional
https://flutter.dev/docs/get-started/install

No meu caso estou utilizando Windows

Criei a pasta Flutter e extraia os arquivos baixados nesta pasta.

F:\Flutter
Enter fullscreen mode Exit fullscreen mode

3º Passo - Variáveis de Ambiente

Defina as variáveis de ambiente e o path do windows apontando para a pasta do Flutter e do Android

Iniciar > Sistema > Alterar Configurações > Avançado > Variáveis de Ambiente
Enter fullscreen mode Exit fullscreen mode

ou

Tecla do Windows + PauseBreak > Alterar Configurações > Avançado > Variáveis de Ambiente
Enter fullscreen mode Exit fullscreen mode

Eu defini todas as minhas variáveis na parte de baixo, ou seja, são Variáveis de Sistema e não só do Usuário, mas fique a seu critério.

Clique em "novo" e defina:

Android 

ANDROID_HOME=F:\Android\
ANDROID_SDK_ROOT=F:\Android\sdk
Enter fullscreen mode Exit fullscreen mode

Path

Só clicar em Novo e adicionar as linhas separadamente

F:\Flutter\bin
F:\Android\sdk
F:\Android\sdk\bin
F:\Android\sdk\tools\bin
F:\Android\sdk\emulator
Enter fullscreen mode Exit fullscreen mode

4º Passo - Android SDK

Baixe o que falta do SDK (system images, platform tools, build tools, platforms e o emulator) através dos comandos abaixo:

sdkmanager system-images;android-28;google_apis;x86_64
sdkmanager platform-tools
sdkmanager build-tools;28.0.3
sdkmanager platforms;android-28
sdkmanager emulator
Enter fullscreen mode Exit fullscreen mode

No dia desta postagem a versão mais recente era 30. Mas acredito que o suporte da versão 28 seja mais ampla.

Caso queira a lista das versões disponíveis utilize:

sdkmanager --list
Enter fullscreen mode Exit fullscreen mode

5º Passo - Licenças Android

Aceite as lincenças do Android

sdkmanager --licenses
Enter fullscreen mode Exit fullscreen mode

digite y e aperte enter para cada licença

6º Passo - Configurar SDK no Flutter

Faça com que o Flutter enxergue o Android SDK

flutter config — -android-sdk F:\Android\
Enter fullscreen mode Exit fullscreen mode

7º Passo - Emulador

Crie o emulador com o nome que deseja, basta substituir o nexus

avdmanager -s create avd -n nexus -k system-images;android-28;google_apis;x86_64
Enter fullscreen mode Exit fullscreen mode

Se preferir, pode criar baseado em um dispositivo real. Eu gosto do Pixel XL, pois quando utilizei com React Native funcionou numa boa (e está melhor)

Pixel XL

avdmanager -s create avd -n PixelXL -k system-images;android-28;google_apis;x86_64 -d 19
Enter fullscreen mode Exit fullscreen mode

Execute o dispositivo emulado

emulator.exe -avd PixelXl
Enter fullscreen mode Exit fullscreen mode

ou

flutter emulators --launch PixelXl
Enter fullscreen mode Exit fullscreen mode

A princípio, a diferença entre esses dois comandos é que pelo flutter você não precisa ficar "preso" a um cmd aberto.

Para ver os emuladores criados utilize:

avdmanager list avd
Enter fullscreen mode Exit fullscreen mode

Para ver a lista de dispositivos disponiveis utilize:

avdmanager list device
Enter fullscreen mode Exit fullscreen mode

Caso queira deletar um emulador criado utilize:

avdmanager delete avd -n PixelXl
Enter fullscreen mode Exit fullscreen mode

8º Passo - VSCode

Instale a extensão do Flutter no seu VSC

https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

9º Passo - Hora da Verdade

Rode o doctor e veja se está tudo correto

flutter doctor
Enter fullscreen mode Exit fullscreen mode

ou

flutter doctor -v
Enter fullscreen mode Exit fullscreen mode

Done

Resultado

Fim

Ficou um pouco extenso, mas é exatamente com estes passos que consegui instalar e emular de maneira mais promissora após muito tempo tentando e sempre ter algum problema. Agora está tudo certo!
Não sou nenhum expert e nem sou um desenvolvedor mobile, mas espero que tenha ajudado de alguma forma.

Até logo! 👋

Top comments (0)

Read next

vhugogarcia profile image

Stay Ahead of the Curve: Embrace .NET MAUI for .NET 9

Victor Hugo Garcia -

wafa_bergaoui profile image

React Native vs. Flutter: Who Will Win the Cross-Platform Development Battle?

Wafa Bergaoui -

madisukma profile image

Flutter Image Compression: Ensuring High Quality

Irfan Adisukma -

amitkumar13 profile image

Memory Leak Detection in React Native with LeakCanary

Amit Kumar -