[Перевод] Flutter 3.16: что нового
Тема Material 3 по умолчанию, предварительный просмотр Impeller для Android, расширения DevTools и многое другое. Наш Flutter Team Lead Юрий Петров, автор ютуб-канала «Юрий Петров | Всё об IT», делится первым переводом официального релиза от Google. Давайте посмотрим, что добавили и улучшили во фреймворке за три месяца с момента релиза Flutter 3.13.
Flutter
Material 3 — по умолчанию
Начиная с версии 3.10 (май 2023) библиотека Material была обновлена в соответствии с последней спецификацией Material Design. Изменения включают новые компоненты и темы компонентов, а также обновленные визуальные эффекты компонентов. До релиза 3.16 применение темы Material 3 было опциональным и устанавливалось через флаг: useMaterial3: true.
В новой версии использование темы Material 3 установлено по умолчанию (#130764). Вы все еще можете отказаться от версии библиотеки материалов Material 3, указав флаг useMaterial3:falseв вашей MaterialApp теме, но имейте ввиду, что Material 2 в конечном итоге устареет и будет удален.
Кроме того, некоторые виджеты нельзя было просто обновить, им требовалась совершенно новая реализация. По этой причине ваш пользовательский интерфейс может выглядеть немного странно, когда вы видите, что он работает как Material 3. Чтобы исправить это, вручную перейдите на новые виджеты, такие как NavigationBar. С более подробной информацией по Material3 можно познакомиться на GitHub.
Демонстрационное приложение позволит вам опробовать все компоненты. В демо-версии поддерживается переключение на Material 3, так что вы можете сравнивать изменения.
Внешний вид компонентов Material 3 в основном определяется значениями [ThemeData.colorScheme] и[ThemeData.textTheme]. Предпочтительным способом создания цветовой схемы Material 3 является использование метода ColorScheme.fromSeed(). Он создает темные и светлые схемы, которые как эстетически приятные, так и соответствующие требованиям контрастности для доступности.
Вы также можете создать цветовую схему на основе доминирующих цветов в изображении с помощью ColorScheme.fromImageProvider. Чтобы дополнительно настроить внешний вид компонентов Material 3, добавьте темы компонентов в свой ThemeData, такие как ThemeData.segmentedButtonTheme or ThemeData.snackBarTheme. Non-null компоненты переопределяют значения по умолчанию, указанные в API документации API.
Поддержка анимации в Material 3
Улучшения в анимации Material 3 включают в себя добавление классов Easing и Durations. Curves Material 2 были переименованы, чтобы включить слово «legacy», и в конечном итоге будут устаревать и удаляться. (#129942)
Добавление дополнительных опций в меню редактирования
На нативной iOS теперь пользователи могут выбирать текст и запускать меню обмена, предоставляющее несколько стандартных сервисов. В этом обновлении добавили опции для выполнения поиска, поиска и обмена.
TextScaler для указания глобального коэффициента масштабирования текста
Для поддержки функции нелинейного масштабирования шрифта в Android 14, которая помогает людям с нарушениями зрения, новый класс TextScaler заменяет свойство Text.textScaleFactor. (#128522)
Обновления в SelectionArea
Класс SelectionAreaв Flutter был обновлен для поддержки нативных жестов, связанных с одиночным или двойным щелчком мыши, а также для долгого нажатия на устройствах с сенсорным экраном. Эти новые жесты доступны по умолчанию при использовании SelectionArea и SelectableRegion.
Одиночный щелчок: установка свернутого выделения в месте щелчка.
Двойной щелчок: выберите слово в месте щелчка.
Двойной щелчок + перетаскивание: расширяет выделение в блоках слов.
Длинное нажатие + перетаскивание: расширяет выделение в блоках слов.
Элементы меню, работающие с активным виджетом
В этом обновлении реализована очистка изменений фокуса при использовании элементов меню: функция applyFocusChangesIfNeeded в FocusManagerтеперь восстанавливает фокус меню. При щелчке пользователя по элементу меню, фокус уже будет установлен на элементе, который имел фокус до открытия меню. (#130536)
Анимация MatrixTransition
Новый виджет MatrixTransition позволяет выполнять преобразования при создании анимированных переходов. Основываясь на текущем значении анимации, вы можете предоставить матричное преобразование, которое применяется к дочернему виджету для создания эффектов, подобных показанным на следующем GIF-изображении. (Пример в DartPad). (#131084)
PaintPattern добавлен в flutter_test.
В пакете flutter_test был добавлен новый класс PaintPattern, который позволяет проверять вызовы рисования, выполняемые на холсте виджетами, такими как CustomPainters и Decorations (используется в модульных тестах).
Ранее для проверки правильности рисования цвета и прямоугольника требовался «золотой файл», но теперь вы можете использовать PaintPattern. Следующий пример подтверждает, что виджет MyWidget на холсте нарисовал круг:
expect(
find.byType(MyWidget),
paints
..circle(
x: 10,
y: 10,
radius: 20,
color: const Color(0xFFF44336),
),
);
// Multiple paint calls can even be chained together.
expect(
find.byType(MyWidget),
paints
..circle(
x: 10,
y: 10,
radius: 20,
color: const Color(0xFFF44336),
),
..image(
image: MyImage,
x: 20,
y: 20,
),
)Этот API ранее существовал глубоко в тестовых файлах фреймворка, и команда Flutter заметила, что некоторые разработчики нашли его настолько полезным, что скопировали его в свои собственные проекты. Если это относится к вам, вы можете удалить копию из вашего проекта после обновления до Flutter 3.16.
Обновления в прокрутке
После первоначального выпуска двумерной основы для прокрутки во Flutter 3.13, в этом выпуске представлены новые функции и улучшения. Flutter 3.16 теперь поддерживает 2D виджеты KeepAlive, а также имеет встроенную поддержку фокусного перехода и неявной прокрутки. 2D виджеты, созданные на этой основе, автоматически получат эту поддержку. Для полного руководства по работе с 2D прокруткой, ознакомьтесь с последним выпуском Flutter Build Show.
Вскоре после выпуска 3.13 был опубликован пакет two_dimensional_scrollables. Этот пакет поддерживается командой Flutter и содержит первый из нескольких виджетов 2D-прокрутки, построенных на основе основе TableView. С момента первого выпуска в него была добавлена поддержка оформления и стиля, а также внесены дополнительные исправления ошибок.
Графический движок (Engine)
Impeller, Android
В этом выпуске команда Flutter рада поделиться информацией о том, что Impeller на Android готов к предварительному тестированию на стабильном канале. С начала этого года команда усердно работала над серверной частью Vulkan для Impeller, и эта предварительная версия включает сбор обратной связи о характеристиках Impeller на устройствах, поддерживающих Vulkan.
Этот график отражает улучшения за последний год во времени растеризации кадров на уровнях 99%-ного, 90%-ного и среднего значения на бенчмарке производительности переходов Flutter Gallery, работающем на серверной частью Vulkan Impeller. Пользователи заметят, что это проявляется в меньшем количестве рывков и более стабильной частоте кадров. К концу этого периода команда Flutter перешла с устройств Samsung S10 на устройства Pixel 7 Pro, что объясняет значительное снижение показателей. Тем не менее, разработчики считают тренд и общие результаты очень обнадеживающими.
Пока не ожидается, что Impeller будет хорошо работать на устройствах без поддержки Vulkan. По мере того как разработчики будут доводить OpenGL Impeller до полной функциональности в ближайшие месяцы, также планируется получить обратную связь о характеристиках Impeller на таких устройствах в будущем стабильном выпуске.
Разработчики Flutter могут попробовать Impeller на устройствах Android, поддерживающих Vulkan, добавив флаг --enable-impeller при запуске flutter runили добавив следующую настройку в файл AndroidManifest.xml своего проекта под тегом
Для определения поддержки Vulkan на устройстве, Impeller использует тесты, описанные в документации репозитория Impeller. Как правило, Impeller использует серверной часть Vulkan на устройствах, работающих под управлением 64-разрядной ОС на уровне API Android 29 или более новой версии. Пользователи также могут определить, поддерживает ли их устройство Vulkan, следуя советам по проверке поддержки Vulkan.
Несмотря на уверенность в прогрессе, достигнутом на данный момент в разработке серверной части Vulkan Impeller, есть несколько известных проблем в период предварительного тестирования:
Платформенные виды пока не реализованы, и фреймы, которые в противном случае должны содержать платформенный вид, работают с некоторыми ограничениями.
Пользовательские шейдеры пока не реализованы.
Для полного списка известных ошибок и отсутствующих функций наиболее актуальная информация содержится на доске проекта Impeller на GitHub. Многие из этих проблем уже имеют исправления, которые появятся в бета-версии 3.17, поэтому, пожалуйста, попробуйте ее.
Команда Flutter в целом довольна прогрессом в достоверности и производительности Impeller на устройствах Android, поддерживающих Vulkan, которые они уже опробовали. Однако по сравнению с iOS, аппаратная экосистема Android намного более разнообразна, и разработчики ожидают более длительный период предварительного тестирования для Android, чем для iOS, перед тем как сделать его по умолчанию на стабильном канале.
Поэтому наиболее полезной обратная связь о Impeller должна включать подробную информацию о конкретном устройстве и версии Android, на которых возникли проблемы.
Кроме того, Vulkan Impeller включает дополнительные возможности отладки в debug сборках, превышающие те, что используются с Skia, и эти возможности добавляют дополнительную нагрузку на производительность во время выполнения. Поэтому важно, чтобы обратная связь о производительности Impeller была получена из профильной или релизной сборки и включала временные характеристики из DevTools, а также сравнение с Skia на том же устройстве.
Наконец, как всегда, команда Flutter очень благодарна за обратную связь, которая включает в себя небольшой воспроизводимый тестовый случай, демонстрирующий проблему.
Производительность, точность и стабильность Impeller
Кроме работы над серверной части Vulkan, начиная с начала этого года, команда также провела ряд улучшений в производительности текста в Impeller, что оказало положительное воздействие как на Android, так и на iOS. В частности, были внесены улучшения в управление атласом глифов Impeller и способом распределения нагрузки текстовых задач между пользовательским интерфейсом (UI) и растровыми потоками Engine. В результате этого пользователи заметят уменьшение рывков при работе с текстовой нагрузкой.
На этой диаграмме показаны улучшения за последний год в отношении 99%-ного, 90%-ного и среднего времени растеризации кадров в тесте производительности Flutter Gallery transition, выполняемом на серверной части Vulkan от Импеллера, которые пользователи будут наблюдать как за меньшим рывком, так и за более высокой частотой кадров в устойчивом режиме. Ближе к концу этого периода разработчики переключились с Samsung S10 на устройства Pixel 7 Pro, что привело к существенному снижению количества устройств. Тем не менее, команда Flutter находит тенденцию и общие результаты очень обнадеживающими.
Команда также усердно работала над улучшением точности и стабильности как для Android, так и для iOS, особенно учитывая запросы пользователей. В частности, за три месяца этого стабильного цикла выпуска команда внесла 209 коммитов, связанных с Impeller, в репозиторий flutter/engine, закрыла 217 задач, включая 42 сообщений пользователей о проблемах с точностью, стабильностью или производительностью.
Производительность
Чтобы обеспечить более высокую производительность на мобильных устройствах с гетерогенной многопроцессорной обработкой, команда Flutter модифицировала механизм таким образом, чтобы потоки, чувствительные к производительности, такие как потоки пользовательского интерфейса и растровые потоки, имели привязку к более мощным ядрам устройства.
Разработчики заметили, что это изменение оказало положительное влияние на ряд тестов и устройств. В некоторых случаях улучшение было значительным: время кадра 99% или 90% файла сократилось вдвое или даже лучше. Команда ожидает, что после этого изменения пользователи заметят меньше зависаний как при работе с серверными модулями Skia, так и с Impeller на Android. Эффект менее заметен на устройствах iOS, где разница между более мощными и менее мощными ядрами меньше.
На этой диаграмме показаны улучшения в худшем, 99%-ном, 90%-ном и среднем времени сборки фрейма и растеризации фрейма практически во всех наших тестах и устройствах Android.
Улучшения API и точности воспроизведения
Наложение производительности Impeller
В предыдущих версиях функция оверлея производительности Flutter не отображалась с Impeller. В этом выпуске этот недочет устранен. Оверлей производительности теперь корректно отображается при включенном Impeller. Сглаживание теперь отображается корректно
В этом выпуске свойство Paint.enableDithering установлено в trueи устарело в соответствии с политикой устаревания Flutter. Теперь сглаживание включено по умолчанию (настраиваемое разработчиком сглаживание больше не поддерживается), и вы больше не увидите проблем с полосами. Для полного объяснения этого изменения и руководства по миграции см. страницу об изменениях на docs.flutter.dev.
До
По
Игры
Набор инструментов для создания игр на Flutter
За последние несколько лет сильно выросло сообщество разработчиков игр в жанре casual. Десятки тысяч игр были опубликованы с использованием Flutter, начиная от простых, но увлекательных головоломок до более сложных аркадных игр. Некоторые из наших любимых включают Trivia Crack от Etermax, 4 Pics 1 Word от Lotum (игра на угадывание слов), Brick Mania от Dong Digital (аркадная игра), StopotS от Onrizon (игра в категории «категории»), ретро-игру в пинбол от Flutter, созданную для I/O, и PUBG Mobile, который использует Flutter в своих социальных сервисах.
Чтобы помочь разработчикам игр стать более продуктивными, сегодня Flutter выпускает крупное обновление своего набора инструментов для казуальных игр. Это коллекция новых ресурсов, которые помогут вам перейти от концепции к запуску с помощью более специфичных для жанра шаблонов, таких как карточная игра, бесконечный раннер, а также интеграция сервисов, таких как Play Games Services, покупками в приложении, рекламой, достижениями, отчетностью об ошибках и поддержкой многопользовательских режимов. Для получения дополнительной информации ознакомьтесь с сообщением о запуске игрового инструментария, написанным Zoey Fan.
Web
События Flutter Timeline в Chrome DevTools
События Flutter Timeline теперь отображаются в разделе производительности Chrome DevTools. (#130132) Чтобы узнать больше, ознакомьтесь с руководством по отладке производительности в веб-приложениях.
Android
Поддержка колесика прокрутки мыши
В ходе оптимизации приложения Wonderous для соответствия рекомендациям Android по использованию больших экранов была выявлена одна проблема: колесико прокрутки мыши плохо работало на планшетах и устройствах с гибкими экранами. Было известно, что пользователю нужно было сделать значительное количество движений колесика прокрутки, чтобы экран начал реагировать. В этом выпуске скорость прокрутки с помощью мыши на виджете Flutter соответствует скорости прокрутки на устройствах Android. (#44724)
До
После
Предсказуемая навигация назад
Релиз Android 14 включил функцию предсказуемого жеста назад, которая позволяет использовать жест назад на устройстве для «подглядывания» на домашний экран за текущим экраном. Это обновление вносит предсказуемые жесты назад в Flutter! Ознакомьтесь с руководством по миграции.
iOS
Расширения приложений
Теперь Flutter можно использовать для направления на некоторые расширения приложений iOS. Это означает, что вы можете создавать пользовательский интерфейс для определенных типов расширений приложений iOS с использованием виджетов Flutter. Это не работает для всех типов расширений приложений из-за возможных ограничений API (например, виджетов на домашнем экране) или ограничений по памяти.
Узнайте больше и посмотрите пример того, как настроить расширение Share на платформе iOS в документации на сайте docs.flutter.dev.
Экосистема пакетов для Flutter
Новые избранные в Flutter
Команда Flutter перезагрузила Flutter Favorite Flutter! Для этого цикла, трепетание экосистемы комитет назначил flame, flutter_animate, flutter_rust_bridge, riverpod, video_player, macos_ui and fpdart пакетами, как новый флаттер избранное. Поздравляем всех!
Предложить пакет или плагин в качестве потенциального будущего фаворита Flutter или задать вопросы комитету, можно отправив электронное письмо на flutter-committee@googlegroups.com.
Облачные стили Google Карт
Платформа Google Карт предлагает возможность настроить стиль вашей карты со страницы Стилей Карт в Консоли Google Cloud. Это позволяет создавать индивидуализированный пользовательский интерфейс без необходимости обновления кода вашего приложения каждый раз, когда вы вносите изменения в стиль.
Чтобы использовать эту функцию в Flutter, вы просто обращаетесь к вашей карте, используя идентификатор карты, установленный в консоли:
GoogleMap(
onMapCreated: _onMapCreated,
initialCameraPosition: const CameraPosition(
target: _kMapCenter,
zoom: 7.0,
),
key: _key,
cloudMapId: _mapId
);Улучшения Camera X
В стабильной версии 3.10 разработчики добавили предварительную поддержку Camera X в плагин камеры Flutter. Camera X — это библиотека Jetpack, которая упрощает добавление богатого функционала камеры в ваше приложение Android.
С этим релизом команда Flutter добавила большинство функций, необходимых любому приложению, использующему камеру. CameraX решает многие проблемы, существующие с реализацией Camera 2 в плагине.
Рекомендуется использовать плагин CameraX. Чтобы включить его, добавьте следующую строку в ваш файл pubspec.yaml.
Dependencies:
camera: ^0.10.4 # Or try the latest camera version
camera_android_camerax: ^0.5.0macOS Видеоплеер
Добавили поддержку macOS в плагин видеоплеера, позволяя разработчикам воспроизводить видео на поверхности виджета.
Чтобы узнать больше, посмотрите плагин видеоплеера на сайте pub.dev.
DevTools — инструменты разработчика
Расширения для DevTools
Новая система расширений для DevTools позволяет: авторам пакетов создавать специальные инструменты для своих пакетов, которые интегрируются непосредственно в DevTools.
авторам пакетов разрабатывать мощные инструменты, использующие существующие фреймворки и утилиты из DevTools;
разработчикам на Dart и Flutter, которые отлаживают приложение с помощью DevTools, получать доступ к инструментам, специфическим для их случаев использования (в зависимости от зависимостей их приложения и того, какие зависимости предоставляют расширения для DevTools).
Благодаря авторам пакетов Provider, Drift, и Patrol эта экосистема уже начала развиваться, и вы можете использовать расширения для DevTools для этих пакетов уже сегодня!
Provider
Patrol
Drift
Для подробного изучения расширений DevTools ознакомьтесь с объявлением о расширениях DevTools для Dart и Flutter от Кензи Дэвиссона.
Обновления DevTools
Основные моменты для DevTools с этим релизом:
добавлена поддержка расширений DevTools;
добавлен новый экран «Главная», который показывает сводку по подключенному приложению.
Другие улучшения включают в себя:
Общая производительность
Надежность горячего перезапуска
Поведение выделения текста и копирования
Отполирован просмотр ответов сетевого профайлера
Чтобы узнать больше, ознакомьтесь с примечаниями к релизам DevTools 2.26.1, 2.27.0 и 2.28.1.
Возможность обнаружения пользовательского интерфейса VS Code
Благодаря замечательной работе члена сообщества Flutter DanTup, расширение Flutter для VS Code теперь имеет боковую панель Flutter, которая предоставляет удобный доступ к:
открытию экранов Flutter DevTools;
просмотру активных сессий отладки;
просмотру доступных устройств;
созданию новых проектов;
горячей перезагрузке и перезапуске;
запуску Flutter Doctor -v;
и многому другому.
Устаревшие функции и изменения, ломающие совместимость
Изменения, ломающие совместимость в этом релизе, включают устаревшие API, срок действия которых истёк после выпуска версии v3.13. Чтобы увидеть все затронутые API, а также дополнительный контекст и руководство по миграции, смотрите руководство по устаревшим функциям для этого релиза. Многие из них поддерживаются инструментом Flutter fix, включая быстрые исправления в IDE. Массовые исправления можно оценить и применить с помощью команды dart fix.
Как всегда, большое спасибо сообществу за вклад в тестирование — это помогает команде определять изменения, ломающие совместимость. Чтобы узнать больше, ознакомьтесь с политикой изменений, ломающих совместимость у Flutter.
В следующем релизе планируется расширить политику устаревания для покрытия пакета flutter_driver в дополнение к уже поддерживаемым пакетам flutter и flutter_test.
Заключение
Команда Flutter упомянула число участников в начале, и это сделано намеренно. Flutter не был бы таким приятным и продуктивным инструментом, каким он является сегодня, без усилий вас всех — нашего удивительного сообщества. Спасибо вам!
Для полного списка PR, включенных в этот релиз, ознакомьтесь с примечаниями к релизу и журналом изменений.
Flutter 3.16 доступен на стабильном канале сегодня и включает Dart 3.2. Чтобы начать работу с последними обновлениями, всё, что нужно сделать — это выполнить команду flutter upgrade.
До скорой встречи!
