TV 设备为应用提供了一组有限的导航控件。能否为您的 TV 应用创建有效的导航架构取决于对这些有限控件的了解,以及用户在操作您的应用时的限制。在构建 Android TV 应用时,请特别注意用户在使用遥控器按钮(而非触摸屏)时如何导航。
原则
目标是让导航感觉自然而熟悉,同时不会占据用户界面或分散对内容的注意力。以下原则有助于为跨电视应用提供一致且直观的用户体验设定基准。
简化了访问内容的流程。用户希望通过最少的点击次数快速访问内容。以最少的界面来整理信息。
遵循最佳实践和建议,让用户可以预测导航行为。不要不必要地重新设计导航模式,因为这会导致用户感到困惑和不可预测。
简化导航,以便无缝支持广泛采用的用户行为。不要添加不必要的导航层,以免过于复杂。
控制器
控制器的样式多种多样,从简约的遥控器到复杂的游戏控制器,应有尽有。所有控制器都包含方向键 (D-pad) 以及选择、主屏幕和返回按钮。其他按钮因型号而异。
方向键
电视上的主要导航方法是通过方向键,其中包括向上、向下、向左和向右方向硬件按钮。方向键会将焦点从一个对象转移到所按按钮方向上的最近对象。
选择按钮
选择屏幕上获得焦点的项目。
主屏幕按钮
将用户带到系统主屏幕。
返回按钮
让用户能够返回到上一个视图。
麦克风按钮
调用 Google 助理或语音输入。
方向键导航
在 TV 设备上,用户可以使用方向键或箭头键进行导航。这种类型的控件将移动限定在上、下、左、右四个方向。如需构建一款针对 TV 优化的出色应用,您提供的导航架构必须能让用户快速学会如何利用这些有限的控件在您的应用内导航。
Android 框架会自动处理布局元素之间的方向导航,因此您通常无需对应用执行任何额外的操作。不过,您应该对通过方向键控制器导航进行全面测试,以发现任何导航问题。
请遵循以下准则来测试您应用的导航系统是否能够在 TV 设备上与方向键很好地搭配使用:
- 确保用户可使用方向键控制器导航到屏幕上的所有可见控件。
- 对于获得焦点的滚动列表,请确保可使用方向键的向上按钮和向下按钮滚动列表,并可使用选择按钮选择列表中的项目。 验证用户是否可选择列表中的元素,以及选择元素时列表是否仍会滚动。
- 确保控件间的切换简单明了并且可以预测。
修改方向导航
Android 框架会根据布局中可聚焦元素的相对位置自动应用方向导航架构。使用方向键控制器在您的应用内测试生成的导航架构。测试后,如果您决定希望用户以特定方式在布局中导航,可以为控件设置显式方向导航。
以下代码示例展示了如何定义下一个获得 TextView 布局对象焦点的控件:
<TextView android:id="@+id/Category1" android:nextFocusDown="@+id/Category2" />
下表列出了 Android 界面 widget 的所有可用导航属性:
| 属性 | 功能 |
|---|---|
nextFocusDown |
定义当用户向下导航时下一个获得焦点的视图。 |
nextFocusLeft |
定义当用户向左导航时下一个获得焦点的视图。 |
nextFocusRight |
定义当用户向右导航时下一个获得焦点的视图。 |
nextFocusUp |
定义当用户向上导航时下一个获得焦点的视图。 |
如需使用其中一个显式导航属性,请将值设为布局中另一个 widget 的 android:id。请务必将导航顺序设为循环,以便最后一个控件能够指引焦点回到第一个控件。
提供明确的焦点和选择
应用在 TV 设备上的导航架构能否发挥作用取决于用户能否快速确定哪个界面元素获得了焦点。如果您不能明确指示获得焦点的项目(因此也就无法明确指示用户可以采取操作的项目),用户可能很快就会因失望而退出您的应用。出于同一原因,在您的应用启动后或者处于闲置状态的任何时间,必须始终有获得焦点的项目可供用户采取操作。
在应用布局和实现中,您可以使用颜色、尺寸和动画其中之一或组合使用这些属性,帮助用户判定接下来可以采取的操作。应使用统一方案在整个应用内指示焦点。
Android 提供了可绘制对象状态列表资源来实现针对获得焦点的控件和选定控件的突出显示。以下代码示例演示了如何通过为按钮启用视觉行为来指示用户已导航到该控件而且随后还选择了它:
<!-- res/drawable/button.xml --> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/button_pressed" /> <!-- pressed --> <item android:state_focused="true" android:drawable="@drawable/button_focused" /> <!-- focused --> <item android:state_hovered="true" android:drawable="@drawable/button_focused" /> <!-- hovered --> <item android:drawable="@drawable/button_normal" /> <!-- default --> </selector>
以下布局 XML 示例代码会将上一状态列表可绘制对象应用于 Button:
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@drawable/button" />
请务必在可聚焦控件和可选择控件内提供足够的内边距,以使其周围的突出显示元素清晰可见。
“返回”按钮导航
为了确保平台上的应用行为一致,请确保返回按钮的行为遵循以下准则。
使用可预测的返回按钮行为
为了打造简单且可预测的导航体验,当用户按下遥控器的返回按钮时,请将他们带到上一个目的地。
如果用户从某个菜单项导航到页面中间的卡片,然后按返回按钮,结果取决于应用使用的是顶部导航还是左侧导航:
- 应用使用顶部导航:通过快速滚动并激活菜单上的焦点,将用户带回页面顶部。
- 应用使用左侧导航:激活左侧侧边菜单并聚焦于当前活跃的菜单项。
确保返回按钮不会被确认界面限制,也不会成为无限循环的一部分。
错误做法:
避免设置退出门槛。允许用户在不确认的情况下退出应用。
错误做法:
永远不会进入关闭和打开菜单的无限循环。理想情况下,按返回按钮会退出应用。除非是特殊情况(例如儿童个人资料),否则请勿在菜单上显示退出按钮。
不显示向上或返回按钮
与手持设备不同,遥控器上的“返回”按钮用于在电视上向后导航。无需在屏幕上显示虚拟返回按钮:
错误做法:
根据需要显示“取消”按钮
如果唯一可见的操作是确认、破坏性或购买操作,建议添加一个返回到上一个目的地的取消按钮:
正确做法:
实现返回导航
Android 框架通常可以很好地处理返回导航,就像处理方向键一样。如果您使用 Navigation 组件,则可以支持各种导航图。有时,您可能需要实现一些自定义行为,例如让返回按钮将焦点重置为长列表的开头。
ComponentActivity 是 FragmentActivity 和 AppCompatActivity 的基类,通过使用它的 OnBackPressedDispatcher(可通过调用 getOnBackPressedDispatcher() 检索),您可以控制返回按钮行为。
如需了解详情,请参阅提供自定义返回导航。
电视上的播放控件
视频播放是电视上最重要的功能之一。Android TV 中各应用的视频播放器必须具有相同的行为。请参阅电视播放控件指南。
“直播”标签页导航
除了遵守 TV 应用质量要求之外,在“直播”标签页上集成了直播电视 Feed 的应用还必须满足流畅播放和直接返回要求,如下几部分所述。
流畅的播放体验
流畅播放适用于从 Google TV 和 Android TV 深层链接到任何直播或线性频道后的应用内行为。
当用户点击深层链接时,系统会应用以下规则:
- 无延迟:用户必须直接进入频道播放,而不会遇到任何阻碍或延迟屏幕,例如登录或注册流程或品牌宣传视频。
- 冷启动异常:如果深层链接从冷启动开始启动目标应用加载,则允许启动延迟。在这种情况下,也允许使用应用启动时的品牌宣传视频或动画。
- 加载延迟例外情况:如果调到频道需要几秒钟,则允许显示品牌宣传内容。时长必须仅为加载频道所需的时间。
如果用户处于已退出状态或未订阅,您可以阻止付费频道的播放,以完成登录或注册流程。
Direct-back
当用户从“直播”标签页上的深层链接启动应用,然后按返回按钮时,无论经过了多长时间,都必须通过一次返回操作返回到“直播”标签页。Google TV 和 Android TV 上的所有“直播”标签页深层链接都必须具有此直接返回行为。
直播标签页深层链接通过附加的深层链接参数 ?exit_on_back=[true|false] 来区分。应用必须解析此参数,以确定应用是否是从“直播”标签页启动的。如果 exit_on_back 为 true,应用必须实现直接返回行为。
请注意,如果用户在深层链接之后首次按下的按钮不是返回按钮,则直接返回要求不适用,只需满足标准的返回按钮行为即可。
例如,假设用户在通过深层链接进入应用后,按下了 D-pad 的选择按钮,从而调出了控制叠加层。用户等待叠加层消失,然后按返回按钮。由于在点击深层链接后按下的第一个按钮是方向键选择按钮,因此不适用直接返回要求。而是应用正常的返回堆栈逻辑。
用户反复按返回按钮必须能返回到应用根目录,然后返回到 Google TV 或 Android TV,而不会出现任何无限循环。如需了解详情,请参阅可预测的返回按钮行为部分。
导航架构
明确定义的导航架构有助于用户了解自己在应用中的位置以及如何访问不同的内容。请考虑导航设计的以下方面。
固定的起始目的地
用户从启动器启动应用时看到的第一个界面,也是用户在按下返回按钮后返回到启动器时看到的最后一个界面。
深层链接可模拟手动导航
无论是深层链接至特定目的地还是手动导航至特定目的地,用户都可以使用返回按钮,通过各目的地导航回起始目的地。
从一个应用深层链接到另一个应用可模拟手动导航。例如,如果用户从 Google TV 直接前往 Moviestar 应用中的详情页面,然后按返回按钮,系统会将他们带到 Moviestar 应用的首页。
清除所有可聚焦元素的路径
让用户能够按照明确的指示浏览您的界面。如果无法直接到达某个控件,请考虑重新放置该控件。
正确做法。
将控件(例如此处显示的搜索操作)放置在不与其他可点击元素重叠的位置。
错误做法:
避免采用将控件放置在难以触及的位置的布局。使用方向键可能难以执行此处显示的搜索操作。
轴
设计布局时,请同时利用水平轴和垂直轴。 为每个方向指定特定功能,以便快速浏览大型层次结构。
可以。
类别可以在垂直轴上遍历,每个类别中的商品可以在水平轴上浏览。
错误做法:
避免使用复杂且嵌套的布局层次结构。