Стоит прочитать: обзор книги «Flutter in action»

Дмитрий Бардин

Руководитель группы разработки ИТ-компании КРОК

Flutter — относительно молодая технология, которая впервые была заявлена в 2015 году. Первый релиз состоялся в мае 2017 года. Разработчик — Google, основной язык — Dart (2011), который изначально задумывался как замена Javascript, но не срослось. Flutter позволяет разрабатывать кроссплатформенные приложения с помощью одной кодовой базы (ну, почти) под iOS, Android, а теперь и веб и десктоп. Материал можно найти в многочисленных статьях, курсах на udemy. На сайте https://flutter.dev очень подробная и актуальная документация.

Есть неплохая, но очень «для начинающих» книга «Flutter на практике». Вообще, книг немного, и следующая, которую я прочитал (и она оказалась «для начинающих с бэкграундом») — «Flutter in action» Эрика Виндмилла, 2020 год.

В самом начале, ещё до содержания, Эрик приводит схему жизненного цикла виджетов — а во Flutter «все виджеты», чтобы читатель осознал, попробовал запомнить и отправился смотреть «почему так».

В первой главе Эрик знакомит читателя с технологией. Он рассказывает, что такое Flutter и в его чём преимущество по сравнению с другими кроссплатформенными технологиями, почему для создания приложений используется Dart и для кого эта книга.

Далее идёт краткий обзор, как работает Flutter, как он устроен, объясняется понятия «всё внутри — виджет».

На небольшом примере Эрик показывает жизненный цикл виджета. Виджеты бывают двух типов: Stateless и Stateful. Сами виджеты неизменяемы, но изменяем объект State. Появляется концепция дерева виджетов — Widget tree. Во Flutter есть два дизайна виджетов: Material и Cupertino — под iOS и Android.

Во второй главе идёт краткое описание языка Dart. Она начинается с традиционного «Hello, world» и описания структуры программы. Язык очень похож на java, javascript и любой другой C-подобный язык. Dart позиционирует себя как ООП язык (объектно-ориентированный язык программирования). И всё внутри его — честные объекты, даже числа.

В главе очень поверхностно описываются типы (никак не раскрывается концепция null-safety), средства управления потоком, циклы, как писать комментарии, переменные, функции (а они в Dart first-citizen), классы.

Эта глава подойдёт тем, кто уже владеет каким-то языком, для быстрого погружения, но не подойдёт как начальное руководство.

В третьей главе «Flutter in action» раскрывается чуть больше внутренних подробностей о работе Flutter. «Hello, world» для Flutter — приложение «Счётчик». На его примере Эрик описывает структуру проекта и как работает hot reload. Далее показаны примеры Stateless и Statefull виджетов, раскрывается управление состоянием, значение метода build.

После автор на примере нескольких виджетов плавно погружает в понятие Element tree, которое существует параллельно Widget tree и является прослойкой между рендерингом и виджетами. Эрик упоминает, что знания про Element tree полезные, но применять их почти никогда не придется.

На этом кончается первая, и, как обещает автор, дальше идут только практические знания.

В четвертой главе появляется приложение «Погода», на базе которого Эрик рассматривает основные виджеты, их свойства, компоновку и управление — MaterialApp, Scaffold, Theme, AppBar, Table, ListView которые позволяют создать макет внешнего вида и настроить необходимые визуальные эффекты.

В пятой главе автор продолжает рассказывать на примере приложения «Погода», как собрать форму из виджетов, использовать обработчик жестов Inputs и Gesture детекторы и сделать свой виджет.

Рассматривается, как управлять состоянием формы через события. И в следующей, шестой главе Эрик описывает, как работать с анимацией, её типы и Canvas виджет. Многие виджеты имеют встроенную анимацию. Она полностью настраиваемая и ,что может быть полезно, имеет обратные вызовы на каждый фрейм, а для создания своего варианта нужно реализовать controller, tween, ticker. Функцию плавности (curve) можно либо менять, либо использовать стандартную.

На этом заканчивается вторая часть и начинается самое интересное — управление состоянием, асинхронные вызовы и навигация.

В седьмой главе Эрик рассказывает про динамический роутинг Flutter’а, описывает всё на примере «Фермерского» приложения и вводит концепцию Navigator, Navigator stack и объясняет работу основных методов:

• pop;
• popUntil;
• canPop;
• push;
• pushNamed;
• popAndPushNamed;
• replace;
• pushAndRemoveUntil.

До этого в примерах состояние менялось через метод setState объекта State. В восьмой главе автор рассказывает о дополнительных способах управления состоянием. Он углубляется в жизненный цикл StatefulWidget’а:

• initState;
• didChangeDependencies;
• build;
• widgetDidUpdate;
• setState;
• dispose.

Также рассказывает о его ограничениях и вводит понятие «третьего» виджета — InheritedWidget. Это особый вид виджета, который определяет контекст в корне поддерева. Он может предоставлять этот контекст каждому виджету в этом поддереве. Способ прямой работы с InheritedWidget подойдёт для небольших приложений.

Далее Эрик рассказывает про подходы и библиотеки от сообщества для управления состоянием — BLOC, Redux, Mobx, которые так или иначе построены на основе InheritedWidget. Но дают разработчику больше абстракции и меньше шансов для ошибки.

Эрик дает подробное описание BLOC подходу — Business Logic Components.

Рассказывает, как он работает, — понятие stream, который передаёт данные, и sink, который получает данные; взаимосвязь между интерфейсом, объектом bloc и данными.

Для наглядности автор приводит пример реализации.

Девятая глава описывает основные концепции асинхронного программирования в Dart — паттерн «наблюдатель», представленный потоками (streams), уже знакомыми по прошлой главе sink, future и обратные вызовы, async и await.

Автор на примере ресторана показывает использования StreamController (sink и stream) — мы заказываем бургер (sink), и данные уходят на кухню (stream).

Возможен вариант одновременного приготовления заказа по частям через StreamController.broadcast() и в этом случае свой поток отправляется каждой отдельной кухне, например, бургер и картошка. По пути он может трансформироваться с помощью метода .transform() и стать вкуснее, ну или наоборот.

Далее Эрик приземляет описанные концепции на паттерн BLOC и рассказывает про StreamBuilder. Он позволяет создавать виджеты с помощью полученных асинхронно данных без лишних конструкций.

В конце главы описан виджет Sliver для быстрого создания, например, каталогов и всего того, что можно проскроллить.

Последняя, четвертая часть делится на две главы.

Десятая глава описывает вспомогательные вещи, без которых сложно представить мобильное приложение — http вызовы и json, показан пример работы с json сериализатором, firebase сервисами для хранения и обработки данных.

В одиннадцатой главе Эрик рассказывает про подходы к тестированию Flutter приложений — unit-тесты в Dart, функциональное тестирование виджетов и интеграционное тестирование. В конце главы описаны следующие шаги:

• FlutterSamples.com — сайт с большим количеством примеров готовых приложений;
• Accessibility Handbook — книга, которая описывает подходы создания веб-сайтов для людей с ограниченными возможностями;
• Flutter’s YouTube channel;
• платформа CodeMagic для CI/CD приложений (бесплатный тариф присутствует).

«Flutter in action» не раскравает особенности работы непосредственно с конкретной платформой — абстракция MethodChannel, работа с камерой, биометрической аутентификацией и так далее.