Jetpack Compose 更新一览 | 2022 Android 开发者峰会-电子发烧友网

作者 /Android 开发者关系工程师 Jolanda Verhoef

去年我们发布了 Jetpack Compose，此后一直在进行优化。我们已添加了新的功能并创造出功能更强大的工具，帮助您获得更高效、更直观、更有趣的 Android 界面开发体验。如果您正在开发一款新应用，那现在是时候用 Compose 来编写了！这一激动人心的 Compose 版本现可支持 Material Design 3、新的 BOM (Bill Of Materials)、稳定版 Compose for Wear OS 和 Android TV Alpha 版、Compose Camp，以及更多新功能！

Jetpack Compose

https://developer.android.google.cn/jetpack/compose
稳定版 Compose for Wear OS

https://android-developers.googleblog.com/2022/07/compose-for-wear-os-10-stable.html

社区中的 Compose

去年，我们了解到许多公司在大规模使用 Compose 进行开发，实现了新功能并将编译界面从 View 迁移至 Compose。例如，我们在与 Lyft 的工程师交谈后得知，他们超过 90% 的新功能代码是用 Compose 编写而成，并且改用 Compose 能够更加轻松便捷地维护代码。他们还分享道: "我们使用 Compose 在应用中重新编写了按钮组件。在此之前，编写该组件需要在三个文件外加 17 个不同 XML 文件中编写 800 行代码，而现在减少到只需一个 Kotlin 文件和 300 行代码即可完成。单就 Kotlin 代码而言，工作量就减少了 60%"。Zepeto 团队同样已在多个功能中使用 Compose，并从中受益，因为 "Compose 简化了我们的界面层逻辑，有助于我们更轻松地理解同事所编写的代码"。

△Jetpack Compose 帮助 Lyft更加轻松便捷地维护代码 | Android 开发故事

大规模使用 Compose 进行开发

https://developer.android.google.cn/jetpack/compose/adopt#what-developers-are-saying
改用 Compose 使 Lyft 团队能够更加轻松便捷地维护代码

https://android-developers.googleblog.com/2022/10/lyft-reduced-their-code-for-ui-components-using-jetpack-compose.html
有助于 Zepeto 团队更轻松地理解同事所编写的代码

https://android-developers.googleblog.com/2022/10/zepeto-plans-to-migrate-80-percent-of-apps-ui-to-jetpack-compose.html

很高兴看到这些团队能够缩短开发周期，编写更加简洁易读的界面代码。他们并不是个例。在今年的 Google I/O 大会过后，Google Play 上排名前 1,000 的应用中使用 Compose 的数量增加了 50%！为了帮助您的团队追随 Lyft、Zepeto 和其他团队的脚步，我们发布了关于如何在您的团队中采用 Compose 的指南。该指南为您介绍如何以及从何处着手，并展示了 Compose 能够带来巨大附加价值的开发领域。

如何在您的团队中采用 Compose 的指南

https://developer.android.google.cn/jetpack/compose/adopt/for-large-teams

Jetpack Compose 2022 年 10 月版发布

现在，我们发布了全新的稳定版 Compose，并为您介绍一些激动人心的功能和最新资讯。

首先，根据用户反馈，我们了解到追踪不同工件的版本会让人望而生畏，因为这些工件可能出现在不同的发布时间表中。因此我们现将一同发布 Bill of Materials 功能，即 BOM，包含所有 Compose 工件的稳定版本，让您能够更轻松地使用。

首版 BOM 发布的同时，Compose 2022 年 10 月版也带来了交错网格支持、直接在画布中绘制文本，下拉刷新，同时包含性能改进和问题修复。

Compose BOM

BOM 是一个 Maven 模块，用于声明一组内容库及其版本。这将很大程度上简化您在 Gradle 依赖项部分定义 Compose 内容库版本的方式，尤其是在我们对不同的 Jetpack Compose 内容库采用独立版本的情况下。您不用再单独定义每个版本，这一过程往往繁重且容易在内容库版本出现不同时出错，现在您只需定义一个 BOM 版本，就能够从中提取所有 Compose 内容库版本。每当 Compose 工件有新的稳定版本时，我们就会发布新的 BOM 版本，因此可更轻松地从一个稳定版转移到另一个稳定版。

dependencies {
    // 导入 Compose BOM
    implementation platform('androidx.compose2022.10.00')


    // 为尚未标明版本的目标 Compose 库声明依赖项
    implementation 'androidx.compose.foundation:foundation'
    androidTestImplementation 'androidx.compose.ui:ui-test-junit4'


    ...
}

对不同的 Jetpack Compose 内容库采用独立版本

https://android-developers.googleblog.com/2022/06/independent-versioning-of-Jetpack-Compose-libraries.html

我们已在快速入门指南中增加关于如何添加 Compose BOM 的说明。请注意，您仍可以选择使用硬编码版本来定义您的依赖项。添加 BOM 这一实用方式是为了简化依赖项并让升级变得更加容易。

快速入门指南

https://developer.android.google.cn/jetpack/compose/setup

深入了解修饰符

一直以来，我们都在幕后努力优化 Compose 性能。Compose 2022 年 10 月版本包括对修饰符工作原理的重大重构。尽管您可能不会在 API 中注意到任何更改，但此次重构会为修饰符性能的重大改进铺平道路。您可以通过下方视频详细了解更改背后的基本原理，以及在 ADS 演讲 Compose 修饰符深入研究中规划的内容。

△Compose 修饰符深入研究 | 2022 Android 开发者峰会

Compose 修饰符深入研究

https://developer.android.google.cn/events/dev-summit/technical-talks

弹出式窗口和对话框高度更改 无障碍功能始终是 Compose 中至关重要的存在，此版本包含一个行为变更，有助于修复采用弹出式窗口和对话框的无障碍功能错误:弹出式窗口和对话框的最大高度由 30dp 下降到 8dp。只有在使用高度超过 8dp 的自定义对话框或弹出式窗口时，您的应用才会受到影响。您可以参阅版本说明，了解有关变更的更多详情，比如为临时解决方案覆盖新行为的方法 (请注意，对于自定义弹出式窗口和对话框，我们始终推荐高度不超过 8dp)。

版本说明

https://developer.android.google.cn/jetpack/androidx/releases/compose-ui

新功能

我们在 Compose 中添加了许多新功能。部分重要内容如下:

使用全新 LazyHorizontalStaggeredGrid 和 LazyVerticalStaggeredGrid 实现交错网格；
使用 DrawScope.drawText 直接在画布中绘制文本；
使用 FontVariation 对象在应用中添加可变字体并更改其属性；
在带注释的字符串中添加 UrlAnnotation 以改进与文本互动的无障碍服务；
使用全新 LineBreakAPI 在您的文本中添加断字功能；
使用全新 pullRefresh 修饰符下拉刷新；
使用 SnapFlingBehavior 在您的惰性列表中添加贴靠行为；
LookAheadLayout 是一种新的布局类型，可以提供关于子项的最终测量与放置信息，帮助您决定中间层布局。

LazyHorizontalStaggeredGrid

http://link.gevents.cn/DYyk4w
LazyVerticalStaggeredGrid

http://link.gevents.cn/GviHF9
FontVariation

https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/text/font/FontVariation
可变字体

https://fonts.google.com/knowledge/topics/variable_fonts
UrlAnnotation

https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/text/UrlAnnotation
LineBreak

https://developer.android.google.cn/reference/kotlin/androidx/compose/ui/text/style/LineBreak
pullRefresh

http://link.gevents.cn/TAA2d2
下拉刷新

https://material.io/design/platform-guidance/android-swipe-to-refresh
SnapFlingBehavior

https://developer.android.google.cn/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapFlingBehavior
LookAheadLayout

http://link.gevents.cn/ETYAtK

Compose Material 3 稳定版

我们还推出了 Compose Material 3 内容库的第一个稳定版本！您可以使用 Compose 构建应用，并根据 Material Design 的最新版本 Material Design 3 设置主题。使用 Material Design 3 进一步自定义您应用的颜色、排版和外观，帮助您的品牌脱颖而出！内容库包含许多界面组件的全新和更新版本，例如按钮、卡片、复选框、开关、导航栏、抽屉式导航栏等，并支持其他即将推出的更新。您可以前往官方文档，查看受支持的所有组件列表，也可以在我们近期的推文中了解详情。

Compose Material 3 内容库

https://developer.android.google.cn/jetpack/androidx/releases/compose-material3
Material Design 3

https://m3.material.io/
官方文档

https://developer.android.google.cn/reference/kotlin/androidx/compose/material3/package-summary#overview

您可以查看我们新的迁移指南，帮助您使用 Material 3，我们在指南中清楚地介绍了如何将 Material 2 概念转化成 Material 3。Android Studio Flamingo 中的默认模板现在会使用 Material 3 来指引您即时正常运行。我们还更新了许多示例应用、教程、模板和 Codelab 以助您轻松使用 Material 3，方便您在实践中学习！

迁移指南

https://developer.android.google.cn/jetpack/compose/themes/material2-material3

新工具

使用 Jetpack Compose 中全新的和已优化的工具可简化应用开发。我们在 Android Studio 中添加了大量新功能，帮助您改进工作流程，提高效率: 最新的稳定版 Android Studio Dolphin 可以为您带来如下功能:

动画协调
MultiPreview 注释
布局检查器中的重组计数

Android Studio Dolphin

https://developer.android.google.cn/studio/releases#new_in_compose

Android Studio Electric Eel 内含 Beta 版功能，如:

实时编辑 (实验性)
突出显示组合渲染效果
配置预览版设备
预览版中的 Live Updates

Android Studio Electric Eel

https://developer.android.google.cn/studio/preview/features#2022.1.1

Android Studio Flamingo 内含 Canary 版功能，比如:

新项目模板默认使用 Compose 和 Material 3
默认开启实时编辑
改进后的组合跟踪，助您更好地检查性能问题。

Android Studio Flamingo

https://developer.android.google.cn/studio/preview/features#2022.2.1

Relay

我们还发布了 Relay 的首个 Alpha 版本，作为设计稿转代码的解决方案，可优化设计者与开发者之间的协作。设计者使用 Figma 插件创建界面组件，开发者则使用 Android Studio 插件将这些组件自动应用到他们的应用中。生成的组件是可组合函数，并可直接被集成到您的 Compose 应用中。您可以查看官方文档，详细了解 Relay。

Relay

https://relay.material.io/
Figma 插件

https://www.figma.com/community/plugin/1041056822461507786
Android Studio 插件https://plugins.jetbrains.com/plugin/19721-relay-for-android-studio/
官方文档https://developer.android.google.cn/jetpack/compose/tooling/relay

面向 Wear OS、大屏幕设备和电视的 Compose

我们在 7 月发布了首个稳定版 Compose for Wear OS，可随时在生产环境中使用。推荐您使用 Compose for Wear OS 来为 Wear OS 应用构建界面。我们在其中加入了二十余种专为可穿戴设备设计的 Compose 界面组件，如 TimeTextPositionIndicator，以及 ScalingLazyColumn。

Compose for Wear OS

https://android-developers.googleblog.com/2022/07/compose-for-wear-os-10-stable.html

我们将持续改进，使其更易于为可折叠设备、平板电脑等大屏幕设备和 ChromeOS 设计、开发和测试应用。material3-window-size-class 内容库已升级为稳定版，为您提供了一组可供使用的视口划分点。大屏幕设备设计通常包含交错网格，新增的 LazyHorizontalStaggeredGrid 和 LazyVerticalStaggeredGrid 有助于实现这些网格。

material3-window-size-class

https://developer.android.google.cn/jetpack/androidx/releases/compose-material3
LazyHorizontalStaggeredGrid

http://link.gevents.cn/DYyk4w
LazyVerticalStaggeredGrid

http://link.gevents.cn/GviHF9

Android 社区的反馈一直推动我们继续向前。我们根据您的反馈更新了路线图，更加侧重于能够帮助您成功使用 Compose 的领域。现在我们正专注于支持更多案例，包括更多 Material 3 组件，改进平台支持、工具和性能。

路线图

https://developer.android.google.cn/jetpack/androidx/compose-roadmap

全新的和更新后的指南

无论您处于学习旅程的哪个阶段，我们都会为您提供帮助！我们新增和优化了有关 Compose 的许多指南:

如果想要体验实践操作，您可以参阅更新后的面向 Android 开发者的 Compose 课程。这一课程涵盖了多种主题，从基础知识到进阶内容，一应俱全。
如果您更喜欢观看视频，可查看 MAD 技巧: Compose 基础知识系列视频，当然，您也可以观看 Android 开发者峰会中有关 Compose 的所有技术分享内容。
您可以阅读有关图像和图形的扩展文档。
想知道使用哪种动画？答案尽在全新的动画备忘单中！
通过全新的调试重组截屏视频和博文，了解如何发现并修复性能问题。
如果考虑在您的现有应用中采用 Compose，您可以参阅扩展版指南: 在应用中采用 Compose。

面向 Android 开发者的 Compose 课程

https://developer.android.google.cn/courses/jetpack-compose/course
MAD 技巧: Compose 基础知识

https://youtube.com/playlist?list=PLWz5rJ2EKKc-CG9riunK996aI6cRhXFDC
Android 开发者峰会

https://developer.android.google.cn/events/dev-summit/technical-talks#modern-android-development
图像和图形

https://developer.android.google.cn/jetpack/compose/graphics
动画备忘单

https://storage.googleapis.com/android-stories/compose/Compose_Animation_Cheat_Sheet.pdf
截屏视频

https://www.youtube.com/watch?v=SWBN0y0lFNY
调试重组博文

https://medium.com/androiddevelopers/jetpack-compose-debugging-recomposition-bfcf4a6f8d37
在应用中采用 Compose

https://developer.android.google.cn/jetpack/compose/interop