一起看 I/O | 可折叠设备、平板设备和大屏设备更新一览
用户们正在看到大屏幕的更多价值,也正在发现用一个设备做更多事情好处多多。专为大屏幕设计的应用无疑能够为用户提供更多助力。
腾讯视频链接
https://v.qq.com/x/page/g3248o9baj7.htmlBilibili 视频链接
https://www.bilibili.com/video/BV1r44y1r7Q2/
可折叠的屏幕也为大型设备提供了更好的人机工程学效果。折叠后,您可以把原本和平板电脑一般大的屏幕放进口袋里,这是以往的便携设备无法做到的。考虑到我们的应用生态系统,我们对此表示非常振奋,硬件的变迁正在让人们对手持设备抱有更多的期待。我们看到,用户对大屏幕的需求也延伸到了平板电脑,鉴于两者类似的应用体验,平板电脑的受欢迎程度现在也已经大幅增加。
本文将带您了解应该如何为大屏幕设备做好准备,以及我们最近的更新将会如何简化应用开发流程。但首先,让我们来谈谈大屏幕本身,以及为什么您应该为大屏幕专门优化您的应用。
为什么要支持大屏设备
在过去的一年里,设备制造商们发布了大批令人兴奋的全新可折叠设备和平板设备。用户能用这些设备做的事情比以往任何时候都多,相关需求也随之增加。如今,通过 Android 大屏设备,开发者们可以覆盖超过 2.5 亿台活跃的可折叠设备、平板电脑和 Chromebook。2020 年,平板电脑设备的销售量增长了 16%。分析师预计,到 2023 年市面上将有超过 4 亿台 Android 平板电脑。另外,可折叠设备也正在重新定义高端设备。Android 应用也可以在 Chrome OS 上运行,而 Chrome OS 现在是世界第二大桌面操作系统:
https://www.bbc.com/news/technology-56116573
为大屏设备做好准备
为大屏幕设计 多任务 输入模式
https://developer.android.google.cn/docs/quality-guidelines/large-screens-app-quality
为大屏幕设计
第一步是确保您的应用是为大屏幕设计的。为了简化这个过程,我们已经定义了具体的窗口尺寸断点和设备类别,以便您进行优化。如果显示设备的最短尺寸大于 600dp,请为应用添加平板电脑布局,并确保应用实现边到边 (edge-to-edge) 全屏体验。开发者还应该让应用支持纵向和横向模式,因为更大的屏幕更可能在横向模式下使用。稍后我们会介绍 Material 自适应组件,来帮助您更好地利用更大的屏幕空间。
实现边到边体验 https://developer.android.google.cn/training/gestures/edge-to-edge
多任务处理
在大屏设备上,用户会默认期待应用支持分屏 (或多窗口模式) 和拖放等互动模式。您的应用应该允许调整窗口大小,来无缝地支持多任务。请正确处理折叠和展开事件,并让您的应用支持多窗口模式,避免应用窗口区域内出现黑边。
△ 在大屏幕布局中,拖放是一种自然的交互,即使是在同一个应用中也是如此
拖放操作
https://developer.android.google.cn/guide/topics/ui/drag-drop
△ 通过使用多实例功能,用户可以并排运行应用的多个副本。用户可以并排比较两个产品,在写文档时参考笔记,或者在规划事件时保持日历可见
输入模式
由于许多人使用大屏幕来提高生产力,平板电脑应该支持基本的键盘、鼠标和手写笔输入。
△ 在 Chrome OS 设备上使用 Android 应用的用户通常会配置实体键盘;应用应该支持标准的键盘导航和快捷键,以提供更全面的无障碍使用体验
组件更新
我们更新了 Jetpack 和 Material Design 库中的许多 UI 组件,以帮助您构建灵活的用户体验,并将手机 UI 扩展到更大的屏幕。
SlidingPaneLayout
在较小的屏幕上不得不堆叠起来的 UI,在大屏幕上则可以轻松实现并排布局。为此,您可以使用更新的 SlidingPaneLayout 库。这个库如今支持双窗格布局,SlidingPaneLayout 会使用两个窗格的宽度来决定如何布局 UI。具体做法是根据内容的宽度和可用空间,自动确定是否可以进行并排布局。例如,如果列表窗格的最小宽度为 200dp,而细节窗格需要 400dp,那么当窗口总宽度在 600dp 或以上时,SlidingPaneLayout 会自动将两个窗格并排显示。
SlidingPaneLayout https://developer.android.google.cn/jetpack/androidx/releases/slidingpanelayout
IOSched https://github.com/google/iosched
我们已经更新了该库,以识别和适应折叠和铰链。如果您使用的是带铰链的设备,并且铰链挡住了部分屏幕,它将自动把内容放置在铰链两边。
FoldingFeature https://developer.android.google.cn/reference/androidx/window/FoldingFeature
我们还引入了锁定模式,允许您控制窗格重叠时的滑动操作 (也支持编程切换)。例如,为了防止用户划进一个空窗格,您可能会让用户必须点击一个列表项来加载该窗格的信息,但允许用户通过划动返回列表。而在可折叠设备或平板电脑上,如果有空间并排显示两个视图,锁定模式会被忽略。
NavRail
导航栏 https://material.io/components/navigation-rail
如果您的应用很强调垂直滚动,那使用 NavRail 就非常合适。因为在这种情况下,使用底部导航栏会造成遮挡,从而减少可见内容的数量,特别是当平板设备横向使用时。
其他组件
Buttons (按钮)
TextFields (文本框) Sheets (表单)
https://material.io/design/layout/component-behavior.html
WindowManager Jetpack 库
除了更新组件以帮助您扩展 UI 外,我们还提供了 WindowManager Jetpack 库来帮助您在大屏幕设备上构建更好的体验。这个库现已发布 alpha 版本,它提供了一套通用的 API 界面,以支持不同的设备类型,包括折叠设备和平板电脑。
窗口管理器 https://developer.android.google.cn/jetpack/androidx/releases/window
WindowManager 还提供了几个便捷的方法,以向后兼容 (从 API 级别 14 开始) 的方式检索当前和最大的 WindowMetrics 信息:
https://developer.android.google.cn/reference/androidx/window/WindowMetrics
平台变化
显示 API 的废弃
您的应用需要确定屏幕或显示尺寸,以便为每个设备适当地渲染内容。随着 WindowMetrics API 的引入,一些与显示尺寸有关的方法已经被废弃。您应该使用 Window Manager Jetpack 库作为向后兼容的替代方法。
WindowMetrics API https://developer.android.google.cn/reference/android/view/WindowMetrics 窗口管理器 https://developer.android.google.cn/jetpack/androidx/releases/window
独占资源
Android 10 提供了同时恢复多个应用的功能,并设有单一的 "顶层恢复" 应用。大多数应用无需更新即可受益于这一变更。最明显的例外则是当您的应用使用了独占资源,如麦克风或摄像头的时候。这方面的更多细节请参阅我们之前的博文:
案例分享
为大屏幕优化应用不仅可以改善用户体验,还可以收获商业成果。我们在 Google Play 上看到越来越多的应用正在把握大屏幕带来的机遇。例如,Google Duo 实现了对平板电脑和可折叠设备的支持,以提升用户体验,在这之后其应用评分和用户粘性均有增加。
Google Duo 通过适配大屏幕提升评分和用户粘性 https://developer.android.google.cn/stories/apps/google-duo
除了 Google Duo 之外,我们还对许多其他应用进行了现代化改造,以使其支持自适应布局,从而活用大屏幕和可折叠设备的优势:
Chrome 浏览器为大屏幕改进标签页导航;
YouTube 重新设计了用户界面,以提高在可折叠设备上的可用性;
Google Photos 在大屏幕上会显示更多的界面元素,如搜索栏;
Google Calendar 在大屏幕上提供了更符合人体工程学的用户界面。
了解更多
适用于平板电脑、大屏设备和可折叠设备的自适应布局 https://developer.android.google.cn/guide/topics/ui/responsive-layout-overview 为可折叠设备构建应用
https://developer.android.google.cn/guide/topics/ui/foldables 大屏幕应用质量指南 https://developer.android.google.cn/docs/quality-guidelines/large-screens-app-quality Material Design 博文: 大屏幕设计 http://material.io/blog/material-design-for-large-screens
您对产品的反馈及问题对我们非常重要,欢迎通过下方二维码向我们提交反馈。您的问题有可能出现在下一期的 FAQ 中并获得解答。感谢您的支持!
推荐阅读