Flutter — это фреймворк, разработанный компанией Google, построенный на собственном языке Google Dart. С одним набором исходного кода он позволяет создавать приложения для веб, iOS, Android, Linux, Windows и даже встроенных устройств. Похожие фреймворки — MAUI от Microsoft и NativePHP для PHP.
Flutter является открытым исходным кодом, предназначен для создания красивых нативно скомпилированных кроссплатформенных приложений из единой кодовой базы. Сейчас многие программисты используют его для разработки Android-приложений.
Flutter генерирует нативный машинный код, поэтому программы, созданные на нём, сложно подвергнуть обратной инженерии. Он компилируется в машинный код ARM или Intel, а также в JavaScript для обеспечения высокой производительности на любых устройствах.
Поддерживается разработка мобильных, веб, настольных и встроенных приложений.
Google интегрировала свои сервисы в Flutter, вы можете использовать их без проблем
Фреймворк интегрируется с экосистемой разработки приложений Google. Бесшовная интеграция с Firebase, Google Ads, Google Play, Google Pay, Google Wallet, Google Maps и другими сервисами упрощает процесс разработки и позволяет охватить более широкую аудиторию.
Flutter использует язык Dart — язык, оптимизированный для быстрого создания приложений под любые платформы.
Официальный сайт Flutter: Flutter — создавайте приложения для любых экранов
Установка
Flutter работает на множестве платформ, все перечисленные ниже операционные системы поддерживают разработку с Flutter.
В данном курсе используется Windows.
Чтобы установить среду разработки Flutter, сначала нужно установить несколько обязательных предварительных программ.
- Установить Git для Windows
Вы можете скачать установщик с официального сайта Git: Git — установка для Windows
Мой компьютер на архитектуре Intel 64-bit, поэтому я устанавливаю эту версию: Git for Windows/x64 Setup.
Установка Git простая, почти не отличается от установки обычных программ. Достаточно последовательно нажимать кнопку «Next».
- Скачать и установить Visual Studio Code
Flutter поддерживает VS Code и Android Studio; выбирайте инструмент разработки по своим предпочтениям. Я сам привык работать в Android Studio, поэтому весь курс построен на нём. Скачайте последнюю версию с официального сайта Android Studio: https://developer.android.com/studio
Установка Flutter
Выше мы установили только вспомогательные программы, сейчас перейдём к установке самого Flutter. Flutter — это фреймворк, его нужно установить в первую очередь для ведения разработки на нём. Если вы используете VS Code для программирования, смотрите другие уроки: в VS Code есть встроенная функция установки Flutter, можно установить Flutter прямо из VS Code.
Установка Flutter и Dart в VS Code аналогична установке других расширений: найдите Flutter и Dart в панели расширений.
Чтобы добавить расширения Dart и Flutter в VS Code, перейдите на страницу расширения Flutter в маркетплейсе и нажмите Установить. Если браузер запросит разрешение, разрешите ему открыть VS Code. Также ознакомьтесь с официальной документацией: Настройка и тест Flutter
Однако автор данного курса не использует VS Code, поэтому мы произведём ручную установку.
Ручная установка Flutter
Ручная установка описана в этой официальной статье: https://docs.flutter.dev/install/manual
Откройте ссылку выше и выберите версию для вашей системы, я использую Windows.
Затем нажмите кнопку скачивания для загрузки архива.
После загрузки распакуйте архив в папку, путь к которой не содержит пробелов и специальных символов. Рекомендуется простой путь, например C:\flutter
Содержимое папки выглядит так:
Далее скопируйте путь к папке bin: C:\flutter\bin и добавьте его в системную переменную окружения Path.
В меню «Пуск» найдите запрос «переменные окружения».
Затем добавьте путь к папке bin в переменную Path.
Установка Dart
После установки Flutter нужно установить Dart. Откройте терминал и выполните следующую команду:
flutter doctorПри выполнении команды автоматически скачивается SDK Dart.
C:\Users\Jack>flutter doctor
Checking Dart SDK version...
Downloading Dart SDK from Flutter engine ...
Expanding downloaded archive with PowerShell...Code language: JavaScript (javascript)Затем проверьте корректность установки. Откройте CMD и запустите команду ниже.
Примечание: в некоторых странах загрузка может завершиться ошибкой, требуется настроить зеркало или прокси. Откройте CMD/PowerShell и последовательно выполните эти команды:
set PUB_HOSTED_URL=https://pub.flutter-io.cn
set FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
flutter doctorCode language: JavaScript (javascript)
Последняя команда flutter doctor проверяет всё окружение Flutter. Слово «doctor» переводится как «врач», это своего рода полная диагностика вашей установки Flutter.
Например, вот результат моей проверки:
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.44.2, on Microsoft Windows [ 10.0.19044.7417], locale zh-CN)
[√] Windows Version (10 IoT LTSC 64-бит, 21H2, 2009)
[X] Android toolchain - develop for Android devices
X Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/to/windows-android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, please use
`flutter config --android-sdk` to update to that location.
[X] Chrome - develop for the web (Cannot find Chrome executable at .\Google\Chrome\Application\chrome.exe)
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.9.1)
[√] Connected device (2 available)
[!] Network resources
X An HTTP error occurred while checking "https://github.com/": истекло время ожидания
! Doctor found issues in 3 категориях.Code language: JavaScript (javascript)Знаки X указывают на некорректно установленные компоненты. Например, без установленного инструмента Android невозможно скомпилировать приложения под Android; без Chrome не получится отладить веб-версию. На следующем шаге мы установим Android Studio. Что касается Chrome — его можно просто скачать и установить. Если вы разрабатываете только настольные приложения для Windows, эти два компонента не обязательны.
Отсутствует Android SDK (невозможно компилировать под Android)
Chrome не обнаружен (невозможно запустить веб-версию)
Ссылка для скачивания Chrome: Google Chrome – скачайте быстрый и безопасный браузер от Google
Установка Android Studio
Последняя скачанная версия установщика — android-studio-quail1-patch1-windows.exe, достаточно дважды кликнуть по файлу для запуска установки.
В процессе установки достаточно последовательно нажимать «Next».
После установки при первом запуске также нажимайте «Next» во всех окнах мастера.
По завершении установки вы сможете создавать проекты в Android Studio.
Теперь снова откройте CMD и запустите flutter doctor для повторной проверки окружения.
[!] Android toolchain - develop for Android devices (Android SDK version 36.1.0)
X cmdline-tools component is missing.
Try installing or updating Android Studio.
Alternatively, download the tools from https://developer.android.com/studio#command-line-tools-only and make sure
to set the ANDROID_HOME environment variable.
See https://developer.android.com/studio/command-line for more details.
X Android license status unknown.
Run `flutter doctor --android-licenses` to accept the SDK licenses.
See https://flutter.dev/to/windows-android-setup for more details.Code language: PHP (php)Откройте Android Studio → File → Settings → Appearance & Behavior → System Settings → Android SDK
Перейдите на вкладку SDK Tools и отметьте:
Android SDK Command-line Tools (latest)
Нажмите Apply и дождитесь завершения скачивания и установки компонентов.
Снова выполните команду flutter doctor
[!] Android toolchain - develop for Android devices (Android SDK version 36.1.0)
! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licensesCode language: CSS (css)Эта ошибка означает, что лицензии Android не приняты.
Лицензии Android не приняты (Some Android licenses not accepted)
Выполните в CMD следующую команду:
flutter doctor --android-licensesЗатем на все запросы вводите y для подтверждения принятия лицензий.
После этого снова запустите flutter doctor в консоли.
C:\Users\Jack>flutter doctor
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.44.2, on Microsoft Windows [версия 10.0.19044.7417], locale zh-CN)
[√] Windows Version (10 IoT Корпоративная LTSC 64-бит, 21H2, 2009)
[√] Android toolchain - develop for Android devices (Android SDK version 36.1.0)
[√] Chrome - develop for the web
[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.9.1)
[√] Connected device (3 available)
[√] Network resources
• No issues found!Code language: JavaScript (javascript)
Отлично, на этом базовая установка Flutter завершена. На следующем уроке мы создадим наш первый пример проекта.