Flutter: Instalace absolutního minima pro vývoj ve Windows

Pokud stejně jako já nechcete zatěžovat svoje Windows těžkopádným Android Studio, emulátory apod. je tu návod na minimalistickou instalaci jenom nezbytných souboru pro vývoj ve frameworku Flutter. Samozřejmě neočekávejte, že s tímto lze plnohodnotně vytvářet “release” verze aplikaci, ale na takový volnočasově psaní, na něčem lehce přenositelném, třeba ve vlaku, je to akorát. Budete potřebovat počítač s Windows (od verze 7 či novější) a smartphone s Androidem (od verze 5 či novější), moje sestava je s bezdrátovým připojením, ale od verze, kdy je telefon zapojen do USB portu kabelem, se to výrazně neliší. Současně se čtením návodu můžete sledovat i video, ve kterém jsou všechny kroky návodu znázorněny, tu:

Stažení SDK a instalačních souborů

Nejprve si vytvořte složku “Android” na disku C:, pak budeme potřebovat Java distribuci, kterou stáhnete na adrese:

AdoptOpenJDK/openjdk8-binaries

• rozklikněte si nejaktuálnější “Assets”, najděte a stáhněte verzi pro Windows x64 v ZIP archivu,
• složku v archivu rozbalte do nově vytvořené složky “Android” na disku C:, a přejmenujte ji na “openjdk”,

SDK pro Flutter stáhnete na adrese:

Windows install

• klepnete na modré tlačitko začinajicí na “flutter_windows_” a končici “-stable.zip”,
• obsah archivu (tj. složku “flutter”) rozbalte do nově vytvořené složky “Android” na disku C:.

Nástroje příkazového řádku Android naleznete na adrese:

Download Android Studio and SDK tools | Android Developers

• tam klikněte na odkaz začínající na “sdk-tools-windows-” a s koncovkou .zip,
• obsah archivu (tj. složku “tools”) rozbalte do nově vytvořené složky “Android” na disku C:.
• Na konec si stáhněte libovolné IDE či redaktor kódu, já osobně používám:

Visual Studio Code - Code Editing. Redefined

tam klepněte na tlačítko “Download for Windows” (ve videu používám Insiders verzi, ale není to podstatné).

Nastavení proměnného prostředí a Android nástrojů

Teď se přesuneme do příkazového řádku (vyhledat v nabídce Windows slovo “cmd” a spustit jako správce) a postupně zadejte tyto příkazy:

setx JAVA_HOME “C:\Android\openjdk”
setx ANDROID_HOME “C:\Android”
setx ANDROID_SDK_ROOT “C:\Android\tools”
setx PATH “%path%;”C:\Android\tools;C:\Android\tools\bin;C:\Android\flutter\bin”

Počítač restartujte. Po restartu opět stejným způsobem přejdeme do příkazového řádku a postupně zadáváme tyto příkazy (v průběhu zadávání je potřeba několikrát potvrzovat licenční ujednání příkazem “y” a následným stisknutím tlačítka Enter):

sdkmanager “system-images;android-28;default;x86_64”
sdkmanager “platform-tools”
sdkmanager --licenses
flutter config --android-sdk C:\Android\
setx PATH “%path%;”C:\Android\platform-tools”
flutter doctor

Poslední příkaz by měl nahlásit, pouze absenci Android Studio (to přece chceme :-)) a chybějící zařízení na kterém budeme svůj kód testovat. To přidáme později, po restartu počítače a instalaci VS Code.

Instalace Visual Studio Code a doplňků

• V prvních krocích jsme stáhli instalační soubor pro Visual Studio Code, ten teď spusťte, a nainstalujte mačkáním tlačítka Next. Potom VS Code spusťte (nespustí-li se sám).
• Po otevření přejdete do sekce „Extenstions“ (ikonka čtyř čtverečků, pod ikonkou brouka).
• Vyhledejte si tam „flutter“ a hned u prvního záznamu zvolte „Install“.
• Vyhledejte si posléze plugin „dart-import“ (ten vám ušetří ruční vyhledávání závislosti ve vašich flutter výtvorech) a zvolte u něj „Install“.

Připojení smartphonu

Nastavení může u různých značek telefonů vypadat trochu jinak, někdy je potřeba i mít přístup ke kořenovému adresáři (tzv. “root”), ale jinak vypadá to zhruba takto:

• Na svém smartphonu přejděte do nastavení a dole otevřete “Informace o telefonu”, tam si 7x klepněte na “Číslo sestavení”,
• zpřístupníte si tzv. “Vývojářský režim”, jeho nabídka se nachází v sekci Systém, v nastaveních telefonu,
• tam si zapněte “Ladění systému Android” (tj. ADB) a “ADB přes síť”
  posléze potvrzujte veškeré upozornění které smartphone zobrazí
  po zaktivnění ADB přes síť, bude v nastavení této položky napsaná IP adresa a port pro přístup (něco jako “192.168.0.x:5555).

Na počítači se opět přesuneme do příkazového řádku a zadáme tam příkaz “adb connect” a výše uvedenou adresu z telefonu, tj. něco podobné tomuto:

adb connect 192.168.0.10:5555

dále pokračujeme v zadávání těchto příkazů:

cd C:\
flutter create test

První spuštění

Ve Visual Studio Code:

• Zvolte ikonku se dvěma složkami, hned nahoře vlevo a zmáčkněte tlačítko „Open Folder“.
• Zvolte složku testovací aplikace, kterou jsme vytvořili na disku C: a zmáčkněte „Otevřít“.
• V menu vlevo rozbalte šipku u složky „lib“ a klikněte na soubor:

main.dart

• dole vpravo buď již bude zaktivněn smartphone zařízení, nebo bude nápis “No Device” (pokud druhá varianta – klepněte na to a zvolte svoje zařízení),
• teď je tedy vše připraveno na start, zmáčkněte na klávesnici F5 a povolte všechny přístupy, o které vás počítač či smartphone požádá.

Hotovo, v případě dotazů mě neváhejte tady v komentářích či jinak kontaktovat.