Установите среду разработки Flutter

Фреймворк для разработки мобильных приложений. Десктоп и веб тоже.

Содержимое страницы

Теперь мне нужно обновить приложение в Google Play Store для использования нового Android SDK, поэтому я полировал и публикую это старое руководство, которое написал несколько лет назад.

Логический детектор приложения в Google PlayStore страница скриншот

Фрагмент из страницы приложения PlayStore.

Это руководство было изначально написано в августе 2022 года, обновлено и опубликовано в апреле 2024 года. Из-за этого оно может содержать некоторые устаревшие материалы.

Как

Шаги по установке Flutter на компьютер с Linux

Установка инструментов разработчика

https://docs.flutter.dev/get-started/install/linux/android

Проверьте инструменты

which bash file mkdir rm which

Установите пакеты

sudo apt-get update -y && sudo apt-get upgrade -y;
sudo apt-get install -y curl git unzip xz-utils zip libglu1-mesa

Установите пакеты для разработки Android-приложений

sudo apt-get install \
    libc6:i386 libncurses5:i386 \
    libstdc++6:i386 lib32z1 \
    libbz2-1.0:i386

Установите пакеты для разработки Linux-приложений

sudo apt-get install \
      clang cmake git \
      ninja-build pkg-config \
      libgtk-3-dev liblzma-dev \
      libstdc++-12-dev

Установка VSCode

https://code.visualstudio.com/docs/setup/linux

Существует ссылка для загрузки пакета Debian VSCode для Linux: https://go.microsoft.com/fwlink/?LinkID=760868

Затем установите его как

sudo apt install ./<file>.deb

# Если вы используете более старое распределение Linux, вам нужно будет выполнить это вместо:
# sudo dpkg -i <file>.deb
# sudo apt-get install -f # Установите зависимости

Другие дистрибутивы Linux также находятся на этой странице “setup/linux”.

Установите расширения Flutter для VSCode: https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

Запустите быстрый доступ VS Code (Ctrl+P), вставьте следующую команду и нажмите Enter.

ext install Dart-Code.flutter

Установка Chrome

Для веб-разработки - установите Chrome:

https://www.google.com/chrome/dr/download/

Установка Android Studio

https://developer.android.com/studio/install#linux

Необходимые библиотеки для Ubuntu на 64

sudo apt-get install libc6:i386 libncurses5:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386

на ОС, основанных на Ubuntu 24.04:

sudo apt-get install libc6:i386 libncurses6:i386 libstdc++6:i386 lib32z1 libbz2-1.0:i386

Скачайте последнюю версию студии с: https://developer.android.com/studio

cd в “{домашняя директория установки}/bin” и введите:

./studio.sh

xed ~/.bash_profile

export PATH=$PATH:~/Apps/android-studio/bin

Включение ускоренного режима KVM

https://developer.android.com/studio/run/emulator-acceleration?utm_source=android-studio#vm-linux

sudo apt-get install cpu-checker
egrep -c '(vmx|svm)' /proc/cpuinfo

Выходной результат 1 или выше означает, что виртуализация поддерживается. Выходной результат 0 означает, что ваш процессор не поддерживает аппаратную виртуализацию.

Ожидаемый результат:

INFO: /dev/kvm существует
Ускорение KVM может быть использовано

Установите KVM на Linux Используйте следующую команду для установки KVM:

Cosmic (18.10) или более поздняя версия:

sudo apt-get install qemu-kvm libvirt-daemon-system libvirt-clients bridge-utils

Установка Flutter SDK

установите sdk https://docs.flutter.dev/get-started/install/linux

https://docs.flutter.dev/get-started/install/linux/android

Можно установить sdk вручную или через VSCode

Примечания по ручной установке:

скачайте https://storage.googleapis.com/flutter_infra_release/releases/stable/linux/flutter_linux_3.3.2-stable.tar.xz

cd prj

tar xf ~/Downloads/flutter_linux_3.3.2-stable.tar.xz

export PATH=$PATH:~/prj/flutter/bin

which flutter

flutter precache

flutter config --no-analytics

flutter config

Примечания по VSCode:

в vs code команда (Ctrl+p)

ext install Dart-Code.flutter

В палитре команд ((Ctrl+shift+p)), введите flutter.

Выберите Flutter: Новое проект.

VS Code запрашивает, где находится Flutter SDK на вашем компьютере.

Если у вас установлен Flutter SDK, нажмите Найти SDK.

Если у вас не установлен Flutter SDK, нажмите Скачать SDK.

Этот вариант отправит вас на страницу установки Flutter, если вы не установили Git, как указано в требованиях к инструментам разработчика.

Когда вас спросят, какой шаблон Flutter?, игнорируйте это. Нажмите Esc. Вы можете создать тестовый проект после проверки своей среды разработки.

После установки в ~/Apps

echo 'export PATH="~/Apps/flutter/bin:$PATH"' >> ~/.bash_profile

source ~/.bash_profile

Чтобы отключить отчеты о телеметрии, выполните эту команду в терминале:

dart --disable-analytics

Установка Android Studio

cd в “{домашняя директория установки}/bin” и введите:

./studio.sh

xed ~/.bash_profile

export PATH=$PATH:/home/yourname/Apps/android-studio/bin

https://docs.flutter.dev/get-started/editor

  • Запустите VS Code.

  • Вызовите Вид > Палитра команд….

  • Введите “install”, и выберите Расширения: Установить расширения.

  • Введите “flutter” в поле поиска расширений, выберите Flutter в списке, и нажмите Установить. Это также устанавливает необходимый плагин Dart.

  • Вызовите Вид > Палитра команд (Ctrl+Shift+P)

  • Введите “doctor”, и выберите Flutter: Запустить Flutter Doctor. (или выполните flutter doctor в окне терминала)

  • Просмотрите вывод в панели ВЫХОД на наличие проблем. Убедитесь, что выбрали Flutter из выпадающего меню в различных вариантах вывода.

Проверка

flutter doctor

[!] Android toolchain - разработка для Android-устройств (версия Android SDK 34.0.0)
    ✗ компонент cmdline-tools отсутствует
      Запустите `path/to/sdkmanager --install "cmdline-tools;latest"`
      См. https://developer.android.com/studio/command-line для получения дополнительной информации.
    ✗ Статус лицензии Android неизвестен.
      Запустите `flutter doctor --android-licenses` для принятия лицензий SDK.
      См. https://flutter.dev/docs/get-started/install/linux#android-setup для получения дополнительной информации.
[✗] Chrome - разработка для веба (Невозможно найти исполняемый файл Chrome в google-chrome)
    ! Невозможно найти Chrome. Попробуйте установить CHROME_EXECUTABLE в исполняемый файл Chrome.
[✓] Linux toolchain - разработка для Linux desktop

Чтобы установить cmdline-tools:

  • Откройте Android Studio,
  • затем SDK (в более),
  • затем установите галочку Android SDK cmdline-tools latest,
  • затем нажмите Применить

Принять лицензии

flutter doctor --android-licenses

Если используется chromium:

which chrome

export CHROME_EXECUTABLE=/usr/lib/chromium/chrome

Проверка версии Flutter и обновление

Проверка версии Flutter:

flutter --version

Чтобы обновить версию Flutter выполните

flutter upgrade

Создание нового проекта Flutter

  • Вызовите Вид > Палитра команд (Ctrl+Shift+P).
  • Введите “flutter”, и выберите Flutter: Новый проект.
  • Выберите Приложение.
  • Создайте или выберите родительскую директорию для новой папки проекта.
  • Введите имя проекта, например my_app, и нажмите Enter.
  • Подождите, пока завершится создание проекта и появится файл main.dart.

Отладка в Flutter

ctrl+p

>flutter: выбрать устройство

Логирование

https://docs.flutter.dev/testing/code-debugging#logging

stderr.writeln(‘print me’);

import 'dart:developer' as developer;

void main() {
  developer.log('log me', name: 'my.app.category');

  developer.log('log me 1', name: 'my.other.category');
  developer.log('log me 2', name: 'my.other.category');
}
---
import 'dart:convert';
import 'dart:developer' as developer;

void main() {
  var myCustomObject = MyCustomObject();

  developer.log(
    'log me',
    name: 'my.app.category',
    error: jsonEncode(myCustomObject),
  );
}

Точки останова

import 'dart:developer';

void someFunction(double offset) { debugger(when: offset > 30.0); // … }

Развертывание на устройство

создайте apk для вашего приложения и попробуйте нижеуказанные команды

очистите свой проект

flutter clean

получите пакеты

flutter pub get

постройте свой apk

flutter build apk --release

найдите свой apk на вашем компьютере

ваше имя проекта\build\app\outputs\flutter-apk(в режиме release)

скопируйте этот APK и установите на мобильное устройство

Сон в Dart

В асинхронном коде

  await Future.delayed(Duration(seconds: 1));

В синхронном коде

  import 'dart:io';
  sleep(Duration(seconds:1));

Полезные ссылки

Полезные пакеты

https://pub.dev/packages/http

https://pub.dev/packages/flutter_easyloading

https://pub.dev/packages/flutter_spinkit

Расширения VSCode

https://medium.com/codex/my-top-5-flutter-extensions-for-vs-code-f36936518ff8

иконки: https://api.flutter.dev/flutter/material/Icons-class.html

все иконки: https://fonts.google.com/icons?selected=Material+Icons

==== Получение данных из интернета ====

https://docs.flutter.dev/cookbook/networking/authenticated-requests

Связанные с: сборкой и выпуском Android-приложения

Веб-приложение Flutter

Плагин Live сервера VSCode

Flutter с бэкендом