Neste tutorial e vídeo aula, vamos aprender a instalar e configurar o Flutter no Windows.
O Flutter (criado pelo Google) é um kit de desenvolvimento de apps para dispositivos móveis (Android e iOS), bem como Desktop ou Web.
Além do Flutter, instalaremos o Android Studio, Visual Studio Code, Emulador de Celular AVD
e ao final desta vídeo aula, criaremos nosso primeiro projeto Flutter.
Com isto, você terá seu ambiente de dev Flutter e poderá iniciar o desenvolvimento de apps para Android e ios.
O que é Flutter ?
O Flutter é um framework do Google que permite construir aplicativos para Android, iOS, Desktop ou Web com apenas um código.
O Flutter SDK (Software Development Kit) tem código aberto e é gratuito.
O Flutter utiliza a linguagem Dart para construir aplicativos.
Dart é uma linguagem concisa, fortemente tipificada e orientada a objetos.
Dart é bem semelhante à linguagens como Swift, C#, Java e JS.
Requisitos de sistema : Flutter
Para instalar e executar o Flutter, seu sistema deve atender a estes requisitos mínimos:
- Sistemas operacionais : Windows 7 SP1 ou posterior (64 bits)
- Espaço em disco : 400 MB (não inclui espaço em disco para IDE / ferramentas).
- Ferramentas :
O Flutter depende da disponibilidade dessas ferramentas em seu ambiente.- Windows PowerShell 5.0 ou mais recente (isso é pré-instalado no Windows 10)
- Git para Windows 2.x, com a opção Usar Git no prompt de comando do Windows .
Mais informações sobre requisitos de instalação do Flutter no Linux e Mac os Consulte:
https://flutter.dev/docs/get-started/install
Requisitos de sistema : Android Studio
Mais Informações, Consulte: https://developer.android.com/studio
Requisitos de sistema : Visual Studio Code
Mais informações, Consulte: https://code.visualstudio.com/docs/supporting/requirements
Instalação Flutter no Windows : Vídeo Aula
Download dos programas : Instalação ambiente de desenvolvimento Flutter
- GIT : https://git-scm.com/downloads
- Android Studio : https://developer.android.com/studio
- Flutter SDK : https://flutter.dev/docs/get-started/install
- HAXM : https://github.com/intel/haxm
- Visual Studio Code : https://code.visualstudio.com/
Instalação Flutter no Windows : Passo a Passo
🕐 Clique nos links de marca de tempo abaixo para assistir o conteúdo de interesse :
⏺ O que é Flutter ? : 1:24
⏺ Requisitos de sistema : 2:02
⏺ Instalação Flutter – Passo a Passo : 3:14
⏺ Passo 1 – Download Git e Android Studio : 4:20
⏺ Passo 2 – Instalação Git : 5:32
⏺ Passo 3 – Baixar pacote de instalação Flutter : 7:33
⏺ Passo 4 – Instalar SDK Flutter : 9:30
⏺ Passo 5 – Instalar o Android Studio : 11:00
⏺ Passo 6 – Correção Problema Erro HAXM em VMs (Maquinas Virtuais) : 14:03
⏺ Passo 7 – Configurar EMULADOR ANDROID e Executar AVD : 15:47
⏺ Passo 8 – Instalar licenças Android : 17:46
⏺ Passo 9 – Instalar e Configurar Visual Studio Code (Opcional) : 21:06
⏺ Passo 10 – Criação Primeiro Projeto Flutter : 28:01
Agora que já conhecemos todos os passos necessários para instalar o Flutter SDK, vamos detalhar cada etapa a seguir.
Passo 1: Download Git e do Android Studio
Os primeiros programas que iremos baixar para criar nosso ambiente de desenvolvimento Flutter são:
- GIT : https://git-scm.com/downloads
- Android Studio : https://developer.android.com/studio
Passo 2 : Instalação do GIT
Logo após o Download dos programas, vamos instalar o git
Para iniciar a instalação do Git, basta clicar no programa instalador baixado pelo navegador
A instalação é bem tranquila, no padrão NNF, Para avançar. basta ir clicando nos botões Next, Next e Finish (install)
Incluir Git no path
Após instalar o git necessitamos inclui-lo no path para que seja possível executar o git bash, a partir de qualquer pasta do sistema operacional.
Para isso, digite var na barra de pesquisa do windows para editar as variáveis de ambiente do sistema.
Depois clique no botão variáveis de Ambiente
E na tela variáveis de ambiente, selecione a variável path e clique no botão editar.
Ao abrir a janela Editar a variável de ambiente, clique no botão novo
e informe o local onde esta instalado o git.
Em nosso caso: C:\Program Files\git
Após isso, clicar no botão OK, você voltará para a tela variáveis de ambiente e basta clicar em OK novamente e na tela propriedades do sistema clicar em OK
Agora basta testar a abertura do git bash
- Veja este processo em nossa vídeo aula
Passo 3 : Baixar pacote de instalação Flutter
Depois de instalarmos o git, vamos baixar o pacote de instalação do SDK Flutter.
Podemos fazer isso de duas formas:
- Via site do Flutter.dev, clicando no botão de download em : https://flutter.dev/docs/get-started/install
- Via Git
- Veja este processo em nossa vídeo aula
Download do SDK Flutter via site do Flutter.dev
No Windows, acesse o site do Flutter.dev e clicar no botão Get Started
- Faça o download do seguinte pacote de instalação para obter a versão estável mais recente do SDK do Flutter na seção Get the Flutter SDK
- Após Completar o download do flutter extraia o arquivo zip e coloque o contido flutter no local de instalação desejado para o SDK do Flutter (por exemplo, C:\src\flutter não instale o Flutter em um diretório como C:\Program Files\ esse que requer privilégios elevados).
- Veja este processo em nossa vídeo aula
Download do Flutter via Git
É possível efetuar o processo download do Flutter SDK via GIT.
Utilizando o comando :
git clone https://github.com/flutter/flutter.git -b stable
Para isso, copie o comando git clone acima e disponivel no site Flutter.dev
Acessar o git bash , a partir do diretorio c:\src e colar o comando
Após isso, o git fará o download dos arquivos do flutter sdk no diretório /src
- Veja este processo em nossa vídeo aula
Passo 4 : Instalar SDK Flutter
Para finalizar a instalação do Flutter precisamos inclui-lo no path e rodar o comando flutter doctor a partir do terminal de comando.
Vamos o atualizar Path com caminho do Flutter SDK
- Acesse a barra de pesquisa do windows e digite: var
- Escolha a opção Editar variáveis de ambiente do sistema,
- depois clique no botão variáveis de ambiente
- Selecione a variável path e clique em editar
- Depois clique em Novo e insira o caminho do SDK do flutter com a pasta bin, no nosso caso:
c:\src\flutter\bin
Após adicionar o caminho no path posso abrir tanto o git bash quanto com o prompt de comando do windows e digitar:
flutter doctor
Para desta forma, verificar a saúde de nossa instalação flutter.
Note que o resultado do comando flutter doctor informa que o Android Studio não esta instalado.
Na sequencia, vamos Instalar o Android Studio e os plugins Flutter e Dart.
Passo 5 : Instalar o Android Studio
Para iniciar a instalação do Android Studio, basta executar o programa instalador baixado.
A instalação do Android Studio segue o padrão NNF (Next/Next/Finish/Install).
- Ao final instalação clico em Finish deixando a opção Start Android Studio marcada e com isso o Android Studio é iniciado.
- Na tela para importar configuração, deixar a opção padrão “Do not import settings” e clicar em OK.
- Na janela Data Sharing, Decida se quer enviar estatísticas para o Google.
- Depois disso será aberta a janela de configuração do Android Studio. Clicar no botão Next.
- Na janela Install Type, escolher a opção Padrão (Standard) e clicar no botão Next.
- Na janela Select UI Theme escolher o tema que mais lhe agrada, escolhemos o tema escuro, opção Darcula.
- Após Seleção clicar em Next.
- Ao final das configuração ira aparecer a janela Verify settings.
- Clicar no botão Finish para iniciar o download e instalação dos componentes.
Ao final da instalação deste componentes é apresentado um resumo.
Normalmente se estiver executando a instalação em uma maquina virtual será apresentado o erro:
Unable to Install Intel HAXM
Esse erro ocorre devido a estar instalando o Android studio em uma maquina virtual.
Iremos corrigi-lo na próxima etapa, por enquanto vamos clicar no botão Finish
Com isso, a tela inicial do Android Studio é aberta.
Instalação Plugins do flutter e do Dart : Android Studio
- Para instalar os Plugins do Flutter e do Dart, para isso clicamos em Configure.
- Selecione Plugins e será aberta a janela para escolha de Plugins.
- Na busca digito flutter, ao exibir o plugin do flutter.dev, clicar no botão install para instalar, depois na tela clico em accept e depois yes e para instalar também o plugin do Dart.
- Após instalar os Plugins é necessário reiniciar o Android Studio e clico no botão Restart IDE
Após reiniciar o Android Studio podemos ver que ele fornece a opção: Start a new Flutter project
Agora vamos a flutter doctor para verificar como esta nossa instalação do flutter
- Veja este processo em nossa vídeo aula
Passo 6 : Correção Problema do Erro HAXM em VMs : Maquinas Virtuais
- Configurar VM – Ativando a opção Virtualize Intel VT-x
- Iniciar a Maquina Virtual e efetuar o Download do HAXM
https://github.com/intel/haxm - Instalar o HAXM
- Veja este processo em nossa vídeo aula
Agora vamos Configurar Emulador Android e Executar AVD ( Android Virtual Device)
Passo 7 : Configurar Emulador Android e Executar AVD ( Android Virtual Device)
- Abri o Android Studio
- Clicar em Configure
- Selecionar AVD Manager
- Na janela Your Virtual Devices clicar Clicar no botão Create Virtual Device
- Selecionar o dispositivo a ser criado, neste caso será Telefone (Phone) Pixel 2 e clicar no botão avançar
- Depois escolher a imagem de sistema, escolheremos Pie e clicaremos em Download
- Na tela de licença clico em accept e no botão Next e o download dos componentes será iniciado.
- Após instalação da imagem clicar em Finish, voltando a tela system image.
- Agora com o release Pie selecionado clicar em Next
- Na próxima tela posso informar um nome para o meu Android Virtual Device e efetuar algumas configurações adicionais, clicar em Next.
- Com isso nosso Android Virtual Device esta criado
- E para inicia-lo basta clicar no botão Play
- Veja este processo em nossa vídeo aula
Passo 8 : Instalar licenças Android
Chegou a hora de instalar as licenças Android.
Neste ponto, muitos se deparam com erros como:
- license status is unknown
- Android license starus unknown
- Android sdkmanager tool not found
- The system cannot find the path specified
Visando evitar erros de licença e SDK e no Android Studio, a solução é Instalar o Android SDK (obsoleto)
Para isso, seguir os passos:
- Acessar o Android Studio,clicar no botão Configure e acessar o SDK Manager
- No SDK Manager, acessar a guia SDK tools e desmarcar a opção hide obsolete package.
- Após isso, escolher o pacote Android SDK tools obsolete e clicar em Apply.
- Confirmar o Download do pacote, clicar em Android SDK Tools e depois em Accept e no botão Next
Com isso, o Android Studio irá efetuar o download e instalação do pacote e na tela final do Android SDK Tools basta clicar no botão Finish.
Voltando para janela anterior, basta clicar em OK
Agora vamos retornar ao prompt de comando e executar o flutter doctor
Com isso, veremos que o erro licença não é mais apresentado, por isso, vamos executar o comando:
flutter doctor –android-licenses
Veja que o comando solicita o aceite das licenças do SDK e basta pressionar Y a cada espera de tela para aceitar as licenças
Agora ao executar o flutter doctor não temos mais eros de licenças e nem do Android toolchain.
A unica issue ou pendencia é de device conectado que será solucionado quando conectarmos um celular no computador ou subirmos um device no AVD.
- Veja este processo em nossa vídeo aula
Passo 9 : Instalar e Configurar o Visual Studio Code (Opcional)
Agora que já temos as licenças instaladas, vamos Instalar e Configurar Visual Studio Code.
Esse passo é Opcional, visto que se você quiser utilizar o Android Studio sem problemas.
Porém o Android Studio exige mais recursos de hardware do computador e se você possui um computador com pouca capacidade de processamento e memoria, o uso do VS Code é uma alternativa interessante.
- Veja este processo em nossa vídeo aula
Passo 10 : Criação do Primeiro Projeto Flutter no Android Studio e Visual Studio Code
- Criação do App no Android Studio + Emulador AVD e Hot Reload
- Criação do App no Visual Studio Code + Emulador AVD e Hot Reload
- Veja este processo em nossa vídeo aula
Materiais e leituras que recomendamos para você:
- 221 Comandos Executar do Windows : Run Commands
- Como Instalar o SQL Developer Oracle no Linux
- Como Ativar Modo Escuro no Whatsapp
- Como Instalar o SQL Server 2019 Express + SSMS : SQL Server Management Studio 18.4
- Como listar as maiores tabelas ou objetos Oracle
Obrigado
Espero que este post tenha sido útil e lhe ajudado a instalar todo ambiente de desenvolvimento Flutter e criar sua aplicação.
Se você gostou deste tutorial, compartilhe com seus amigos ou nos acompanhe pelas redes sociais.
Você pode nos ajudar a criar mais conteúdos como este. Como ?
Prestigie nossos anunciantes conhecendo seus produtos e serviços.
É simples e rápido e você certamente ajuda a gente a crescer.
Obrigado e um grande abraço
Renato Sanches
