查看原文
其他

Jetpack Compose 更新一览 | 2022 Android 开发者峰会

Android Android 开发者 2022-12-14

作者 / 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.compose:compose-bom:2022.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 中添加了许多新功能。部分重要内容如下:

  • 使用全新 LazyHorizontalStaggeredGridLazyVerticalStaggeredGrid 实现交错网格;
  • 使用 DrawScope.drawText 直接在画布中绘制文本;
  • 使用 FontVariation 对象在应用中添加可变字体并更改其属性;
  • 在带注释的字符串中添加 UrlAnnotation 以改进与文本互动的无障碍服务;
  • 使用全新 LineBreak API 在您的文本中添加断字功能;
  • 使用全新 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 内容库已升级为稳定版,为您提供了一组可供使用的视口划分点。大屏幕设备设计通常包含交错网格,新增的 LazyHorizontalStaggeredGridLazyVerticalStaggeredGrid 有助于实现这些网格。


  • 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



Compose Camp



Compose Camp 是一个由社区组织的全球系列活动,该活动将从九月一直持续到十二月!Compose Camp 同时包含初学者路径和资深者路径,所有水平的开发者均可加入一同学习。活动已在如火如荼地进行中,全球各地的 GDG 和 GDSC 发布了多支视频,社区平台也举办了众多活动。


  • Compose Camp
    https://developer.android.google.cn/compose-camp

  • 如火如荼地进行中
    https://twitter.com/search?q=%23ComposeCamp&src=typeahead_click

  • 视频
    https://space.bilibili.com/64169458/channel/collectiondetail?sid=735148



祝您拥有愉快的 Compose 使用体验!



希望您和我们一样对这些进展感到兴奋!如果您尚未开始,现在就是学习 Jetpack Compose,并帮助您的团队和开发流程从中受益的最佳时机。准备好体验更快的开发速度和更高的工作效率吧。祝您拥有愉快的 Compose 使用体验!也欢迎您持续关注我们,及时了解更多开发技术和产品更新等资讯动态。


  • Jetpack Compose
    https://developer.android.google.cn/jetpack/compose




推荐阅读

如页面未加载,请刷新重试

 点击屏末 | 阅读原文 | 即刻了解 Jetpack Compose 更多相关内容



您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存