优化应用以适用于 ChromeOS

Android 应用在重新定义大型屏幕上现代计算的样貌方面发挥着重要作用。但是,仅仅在 Chromebook 上运行您的移动应用并不能为您的用户提供最佳体验。

此页面详细介绍了一些您可以针对笔记本电脑和平板电脑等设备调整体验的方式。请参阅我们的综合测试列表,以了解有关测试应用在这些设备上的兼容性的更多信息。

利用对自由表单多窗口的支持

ChromeOS 上的 Android 应用的实现包括基本的多窗口支持。Android 在 ChromeOS 上将应用呈现到自由表单窗口容器中,而不是始终占据整个屏幕,这更适合这些设备。

用户可以调整包含 Android 应用的窗口的大小,如圖 1 所示。要确保您的自由表单窗口平滑调整大小并向用户显示其所有内容,请阅读窗口管理中的指南。

图 1. 可调整大小的应用窗口。

您可以通过遵循以下最佳实践来改善应用在 ChromeOS 上运行时的用户体验

  • 在多窗口模式下正确处理活动生命周期,并确保即使在应用不是最顶层焦点窗口时也要继续更新 UI。
  • 确保您的应用在用户调整其窗口大小时适当地调整其布局。
  • 通过指定其启动大小来自定义应用窗口的初始尺寸。
  • 请注意,应用根活动的屏幕方向会影响其所有窗口。

自定义顶部栏颜色

ChromeOS 使用应用主题为显示在应用顶部的顶部栏着色,当用户按住窗口控件和后退按钮时会显示该顶部栏。为了使您的应用看起来精致且针对 ChromeOS 定制,请在应用的主题中定义colorPrimary,如果可能,请定义colorPrimaryDark值。

colorPrimaryDark 用于着色顶栏。如果仅定义了 colorPrimary,ChromeOS 会在顶栏中使用其较暗的版本。有关更多信息,请参阅样式和主题

支持键盘、触控板和鼠标

所有 Chromebook 都有物理键盘和触控板,有些还配备了触摸屏。某些设备可以从笔记本电脑转换为平板电脑形式。

在您的 ChromeOS 应用中,支持来自鼠标、触控板和键盘的输入,以便在没有触摸屏的情况下也能使用该应用。许多应用已经支持鼠标和触控板,无需额外操作。但是,最好根据鼠标相应地自定义应用的行为,并支持和区分鼠标和触摸输入。

确保

  • 所有目标都可以用鼠标点击。
  • 所有可触摸滚动的表面都在鼠标滚轮事件上滚动,如图 2 所示。
  • 谨慎地实现悬停状态,以改善 UI 发现,而不会让用户感到不知所措,如图 3 所示。

图 2. 使用鼠标滚轮滚动。

图 3. 按钮悬停状态。

在适当的情况下,区分鼠标和触摸输入。例如,触摸并按住某个项目可能会触发多选 UI,而右键单击同一项目可能会改为触发选项菜单。

自定义光标

自定义应用的鼠标光标,以指示用户可以与 UI 的哪个元素进行交互以及如何交互。您可以通过调用 setPointerIcon() 方法,设置用户与视图交互时使用的 PointerIcon

在您的应用中,显示以下所有内容

  • 文本的 I 形光标
  • 可调整大小图层边缘的调整大小手柄
  • 用于可以通过点击并拖动手势平移或拖动的内容的开合手形光标
  • 处理微调器

PointerIcon 类提供了一些常量,您可以使用这些常量来实现自定义光标。

键盘快捷键和导航

由于每个 Chromebook 都有物理键盘,因此请提供热键以提高用户的工作效率。例如,如果您的应用支持打印,则可以使用 Control+P 打开打印对话框。

同样,使用标签导航处理所有重要的 UI 元素。这对于辅助功能尤其重要。为了满足辅助功能标准,所有 UI 表面都必须具有明显且符合辅助功能的焦点状态,如下面的图所示

图 4. 横向标签切换。

图 5. 用在悬停时显示的控件替换滑动手势。

确保为隐藏在特定于触摸的交互(例如触摸并按住操作、滑动或其他多点触控手势)下的核心功能实现键盘或鼠标替代方案。一种示例解决方案是在表面悬停时提供按钮。

有关键盘、触控板和鼠标支持的更多信息,请参阅大屏幕上的输入兼容性

进一步增强用户输入

要为您的应用获得桌面级功能,请考虑以下面向生产力的输入。

上下文菜单

Android 上下文菜单是另一种加速器,可将用户带到应用的功能,可以通过单击鼠标或触控板的辅助按钮或通过触摸屏上的触摸并按住来触发。

图 6. 右键单击时显示的上下文菜单。

拖放

构建拖放交互(如以下图所示)可以为您的应用带来高效、直观的生产力功能。有关更多信息,请参阅拖放

图 7. 文件树界面中的拖放。

触笔支持

对于绘图和笔记应用,触笔支持至关重要。通过实施针对触笔输入使用情况量身定制的交互,为配备触笔的 Chromebook 和平板电脑提供增强的支持。

在设计触笔交互时,请考虑不同触笔硬件的潜在差异。有关触笔 API 的概述,请参阅大屏幕上的输入兼容性

使您的布局响应式

无论应用的可视状态(全屏、纵向、横向或窗口化)如何,都要充分利用应用可用的屏幕空间。一些良好的空间使用示例包括以下内容

  • 显示应用架构。
  • 将文本长度和图像大小限制为最大宽度。
  • 更好地利用应用工具栏中的空间。
  • 通过使应用适应鼠标使用而不是拇指使用来改进 UI 辅助功能的放置。
  • 优化视频和图像的大小,为所有媒体建立一组最大宽度和高度,并最大限度地提高可读性和可扫描性。
  • 实现响应式列系统。有关更多信息,请参阅响应式布局网格
  • 如有必要,使用列系统调整和修改 UI。尽可能避免打开新窗口。
  • 删除或减少水平滚动组件的重要性。
  • 避免全屏模态 UI。对于所有非关键操作,请使用内联 UI(例如进度指示器和警报)。
  • 使用改进的 UI 组件,例如时间和日期选择器、文本字段和菜单,这些组件专为鼠标、键盘和更大屏幕而设计。
  • 对于小型到中型的编辑功能,请使用内联编辑、其他列或模态 UI,而不是新的活动。
  • 删除或修改浮动操作按钮 (FAB) 以获得更好的键盘导航。默认情况下,FAB 在横向标签切换顺序中位于最后。相反,将其置于首位,因为它是最主要的动作,或者将其替换为其他更高级别的辅助功能。

图 8. 手机和台式机大小屏幕上的响应式布局模拟。

系统级后退按钮是从 Android 手持设备的根源继承的模式,在桌面环境中不太适用。

随着应用越来越适合笔记本电脑环境,请考虑转向一种淡化后退按钮的导航模式。通过在应用中提供应用内后退按钮、面包屑或其他退出路线(如关闭或取消按钮)作为其大屏幕 UI 的一部分,让应用处理其自己的历史记录堆栈。

您可以通过在 <activity> 标签内设置首选项来控制应用是否在其窗口中显示后退按钮。设置为 true 将隐藏后退按钮。

<meta-data android:name="WindowManagerPreference:SuppressWindowControlNavigationButton" android:value="true" />

解决摄像头预览图像问题

当应用只能在纵向模式下运行,但用户在横向屏幕上运行它时,可能会出现摄像头问题。在这种情况下,预览或捕获的结果可能会被错误地旋转。

兼容模式更改了系统在 ChromeOS 中处理事件(如方向更改)的方式。这有助于防止在错误的方向模式下使用摄像头时出现问题。要启用兼容模式,请满足以下条件

  • 至少面向 Android 7.0(API 级别 24)。最低 SDK 级别可以更低。
  • 使您的应用可调整大小。

处理设备设置

请考虑在 ChromeOS 上运行的应用的以下设备设置。

更改音量

ChromeOS 设备是固定音量设备:播放声音的应用具有自己的音量控制。请遵循使用固定音量设备的相关指南。

更改屏幕亮度

您无法调整 ChromeOS 上的设备亮度。对 系统设置WindowManager.LayoutParams 的调用将被忽略。

其他学习资料

要详细了解如何优化您的 Android 应用以用于 Chromebook,请查阅以下资源