Register now for Android Dev Summit 2019!

创建 TV 导航

TV 设备为应用提供了一组有限的导航控件。能否为您的 TV 应用创建有效的导航架构取决于对这些有限控件的了解,以及用户在操作您的应用时的感知极限。在构建 Android TV 应用时,请特别注意用户实际如何使用遥控器按钮(而非触摸屏)在您的应用内导航。

本课介绍创建有效 TV 应用导航架构的最低要求,以及如何将这些要求应用于您的应用。

启用方向键导航

在 TV 设备上,用户通过遥控器设备上的控件进行导航,即使用方向键或箭头键来导航。这种类型的控件将移动限定在上、下、左、右四个方向。要构建一款针对 TV 优化的出色应用,您提供的导航架构必须能让用户快速学会如何利用这些有限的控件在您的应用内导航。

Android 框架会自动处理布局元素之间的方向导航,因此您通常无需对应用执行任何额外的操作。不过,您应该对通过方向键控制器导航进行全面测试,以发现任何导航问题。请遵循以下准则来测试您应用的导航系统是否能够在 TV 设备上与方向键很好地搭配使用:

  • 确保用户可使用方向键控制器导航到屏幕上的所有可见控件。
  • 对于获得焦点的滚动列表,请确保可使用方向键的向上键和向下键滚动列表,并可使用 Enter 键选择列表中的项目。验证用户是否可选择列表中的元素,以及选择元素时是否列表仍会滚动。
  • 确保控件间的切换简单明了并且可以预测。

修改方向导航

Android 框架会根据布局中可聚焦元素的相对位置自动应用方向导航架构。您应使用方向键控制器在您的应用内测试生成的导航架构。测试后,如果您决定希望用户以特定方式在布局中导航,则可以为控件设置显式方向导航。

注意:只有在系统应用的默认顺序不太奏效时,才应使用这些属性来修改导航顺序。

以下代码示例展示了如何定义下一个获得 TextView 布局对象焦点的控件:

    <TextView android:id="@+id/Category1"
            android:nextFocusDown="@+id/Category2"\>
    

下表列出了 Android 界面微件的所有可用导航属性:

属性 功能
nextFocusDown 定义当用户向下导航时下一个获得焦点的视图。
nextFocusLeft 定义当用户向左导航时下一个获得焦点的视图。
nextFocusRight 定义当用户向右导航时下一个获得焦点的视图。
nextFocusUp 定义当用户向上导航时下一个获得焦点的视图。

要使用其中一个显式导航属性,请将值设为布局中另一个微件的 ID(android:id 值)。您应将导航顺序设为循环,以便最后一个控件能够指引焦点回到第一个控件。

提供明确的焦点和选择

应用的导航架构能否在 TV 设备上发挥作用取决于用户判定屏幕上获得焦点的界面元素有多么容易。如果您不能明确指示获得焦点的项目(因此也就无法明确指示用户可以采取操作的项目),用户可能很快就会因失望而退出您的应用。出于同一原因,在您的应用启动后或者处于闲置状态的任何时间,必须始终有获得焦点的项目可供用户采取操作。

您的应用布局和实现应使用颜色、尺寸和动画其中之一或组合使用这些属性来帮助用户轻松判定他们接下来可以采取的操作。应使用统一方案在整个应用内指示焦点。

Android 提供了可绘制对象状态列表资源来实现针对获得焦点的控件和选定控件的突出显示。以下代码示例演示了如何通过为按钮启用视觉行为来指示用户已导航到该控件而且随后还选择了它:

    <!-- res/drawable/button.xml -->
    <?xml version="1.0" encoding="utf-8"?>
    <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" />
    

请务必在可聚焦控件和可选择控件内提供足够的内边距,以使其周围的突出显示元素清晰可见。

如需了解有关为 TV 应用设计有效选择和焦点的更多建议,请参阅面向 TV 的模式