Тест-драйв

На этой странице описано, как создать новое приложение Flutter из шаблонов, запустить его и попробовать быструю перезагрузку Hot Reload после внесения изменений в приложение.

Выберите инструмент разработки для написания, создания и запуска приложений Flutter.

Android Studio и IntelliJ

Создание приложения

  1. Откройте IDE и выберите Start a new Flutter project (Запустить новый проект Flutter).
  2. Выберите Flutter Application в качестве типа проекта. Затем нажмите Next.
  3. Убедитесь, что путь к SDK Flutter указывает местоположение SDK (выберите Install SDK… если текстовое поле пустое).
  4. Введите имя проекта (например, myapp). Затем нажмите кнопку Next.
  5. Нажмите Finish.
  6. Подождите, пока Android Studio установит SDK и создаст проект.
Примечание: При создании нового приложения Flutter некоторые IDE-плагины Flutter запрашивают доменное имя компании в обратном порядке, что-то вроде com.example. Доменное имя компании и название проекта используются вместе как название пакета для Android (Bundle ID для iOS), когда приложение выпускается. Если вы думаете, что приложение может быть выпущено, лучше указать имя пакета сейчас. Имя пакета не может быть изменено после того, как приложение будет выпущено, так что сделайте имя уникальным.

Вышеуказанные команды создают каталог проекта Flutter под названием myapp, который содержит простое демо-приложение, использующее Material Components.

Подсказка: Код вашего приложения находится в lib/main.dart. Высокоуровневое описание того, что делает каждый блок кода, смотрите в комментариях в верхней части этого файла.

Запуск приложения

  1. Найдите главную панель инструментов Android Studio:

2. В target selector выберите устройство Android для запуска приложения. Если ни одно из них не отображается в списке как доступное, выберите Tools> Android > AVD Manager и создайте его там. Подробности см. в разделе Managing AVDs.
3. Щелкните значок «Запуск» на панели инструментов или вызовите пункт меню Run > Run.

Внимание: При запуске приложения с Mac, если вы видите ERROR: Could not connect to lockdownd, код ошибки -17, убедитесь, что вы доверяете своему компьютеру.

После завершения сборки приложения на устройстве появится стартовое приложение.

Попробуйте быструю перезагрузку

Flutter предлагает быстрый цикл разработки с Stateful Hot Reload, возможность перезагрузки кода живого приложения без перезапуска или потери состояния приложения. Сделайте изменение в исходном коде приложения, сообщите вашей IDE или инструменту командной строки, что вы хотите быструю перезагрузку, и посмотрите изменения в вашем симуляторе, эмуляторе или устройстве.

  1. Откройте lib/main.dart.
  2. Измените строку
'You have pushed the button this many times'

на:

'You have clicked the button this many times'
Важно: Не останавливайте ваше приложение. Пусть ваше приложение работает.

3. Сохраните изменения: вызовите команду «Save All» или нажмите кнопку «Hot Reload«.

Вы увидите обновленную строку в работающем приложении почти сразу.

Профиль или запуск версии

Важно: Не тестируйте производительность вашего приложения с включенной функцией отладки и горячей перезагрузки.

До сих пор вы запускали свое приложение в режиме отладки. В отладочном режиме производительность обменивается на полезные функции разработчика, такие как горячая перезагрузка и пошаговая отладка. Неудивительно, что в отладочном режиме вы увидите медленную производительность и дрожащую анимацию. Как только вы будете готовы проанализировать производительность или выпустить ваше приложение, вы захотите использовать режимы сборки Flutter’s «profile» или «release». Подробности см. в разделе Режимы сборки Flutter.

Важно: Если вас беспокоит размер пакета вашего приложения, см. раздел Измерение размера приложения.

Visual Studio Code

Создание приложения

  1. Вызовите View > Command Palette.
  2. Введите “flutter”, и выберите Flutter: New Project.
  3. Введите имя проекта, например myapp, и нажмите Enter.
  4. Создайте или выберите родительский каталог для новой папки проекта.
  5. Дождитесь окончания создания проекта и появится файл main.dart.

Вышеуказанные команды создают каталог проекта Flutter под названием myapp, который содержит простое демо-приложение, использующее Material Components.

Примечание: При создании нового приложения Flutter некоторые IDE-плагины Flutter запрашивают доменное имя компании в обратном порядке, что-то вроде com.example. Доменное имя компании и название проекта используются вместе как название пакета для Android (Bundle ID для iOS), когда приложение выпускается. Если вы думаете, что приложение может быть выпущено, лучше указать имя пакета сейчас. Имя пакета не может быть изменено после того, как приложение будет выпущено, так что сделайте имя уникальным.
Внимание: Если VS Code был запущен во время первоначальной настройки флаттера, возможно, вам понадобится перезапустить его для плагина VS Code Flutter для обнаружения SDK флаттера.
Подсказка: Код вашего приложения находится в lib/main.dart. Высокоуровневое описание того, что делает каждый блок кода, смотрите в комментариях в верхней части этого файла.

Запуск приложения

  1. Найдите строку состояния VS Code (синяя строка в нижней части окна):

2. Выберите устройство в области «Выбор устройства». Подробности см. в разделе Быстрое переключение между устройствами Flutter.

  • Если устройство недоступно и вы хотите использовать симулятор устройства, нажмите No Devices и запустите симулятор.
  • Чтобы настроить реальное устройство, следуйте инструкциям для конкретного устройства на странице «Установка» для вашей операционной системы.

3. Вызовите Run > Start Debugging или нажмите F5.
4. Дождитесь запуска приложения — прогресс выводится в окне Debug Console.

Внимание: При запуске приложения с Mac, если вы видите ERROR: Could not connect to lockdownd, код ошибки -17, убедитесь, что вы доверяете своему компьютеру.

После завершения сборки приложения на устройстве появится стартовое приложение.

Попробуйте быструю перезагрузку

Flutter предлагает быстрый цикл разработки с Stateful Hot Reload, возможность перезагрузки кода живого приложения без перезапуска или потери состояния приложения. Сделайте изменение в исходном коде приложения, сообщите вашей IDE или инструменту командной строки, что вы хотите быструю перезагрузку, и посмотрите изменения в вашем симуляторе, эмуляторе или устройстве.

  1. Откройте lib/main.dart.
  2. Измените строку
'You have pushed the button this many times'

на:

'You have clicked the button this many times'
Важно: Не останавливайте ваше приложение. Пусть ваше приложение работает.

3. Сохраните изменения: вызовите команду «Save All» или нажмите кнопку «Hot Reload«.

Вы увидите обновленную строку в работающем приложении почти сразу.

Профиль или запуск версии

Важно: Не тестируйте производительность вашего приложения с включенной функцией отладки и горячей перезагрузки.

До сих пор вы запускали свое приложение в режиме отладки. В отладочном режиме производительность обменивается на полезные функции разработчика, такие как горячая перезагрузка и пошаговая отладка. Неудивительно, что в отладочном режиме вы увидите медленную производительность и дрожащую анимацию. Как только вы будете готовы проанализировать производительность или выпустить ваше приложение, вы захотите использовать режимы сборки Flutter’s «profile» или «release». Подробности см. в разделе Режимы сборки Flutter.

Важно: Если вас беспокоит размер пакета вашего приложения, см. раздел Измерение размера приложения.