テレビデバイスでは、アプリのナビゲーション コントロールが限定されています。テレビアプリ向けの効率的なナビゲーション スキームを作成するには、ナビゲーション コントロールがこのように限定されていることと、アプリを使用するユーザーの認識に限界があることを理解することが重要です。テレビ向け Android アプリをビルドする際には、ユーザーがタッチスクリーンではなくテレビのリモコンボタンを使用して実際にどのようにアプリをナビゲートするかをよく考える必要があります。
このレッスンでは、効率的なテレビアプリのナビゲーション スキームを作成するための最小要件と、アプリにその要件を適用する方法を説明します。
D-pad によるナビゲーションを有効にする
テレビデバイスでは、ユーザーはリモコンの十字キー（D-pad）または矢印キーを使用してナビゲーション操作を行います。リモコンでの操作は上、下、左、右方向への移動のみが可能です。テレビ向けに最適化された使いやすいアプリをビルドするには、このような限られたコントロールでアプリを操作する方法をユーザーがすぐに習得できるナビゲーション スキームが必要です。
Android のフレームワークでは、レイアウト要素間の方向ナビゲーションが自動的に処理されるため、通常は特に何もする必要はありません。ただし、D-pad コントローラによるナビゲーションを十分にテストし、問題なく操作できることを確認する必要があります。次のガイドラインに沿って、アプリのナビゲーション システムがテレビデバイスの D-pad を使用したときに正しく動作するかどうかをテストしてください。
- ユーザーが D-pad コントローラを使ってスクリーン上のすべてのコントロールに移動できることを確認する。
- フォーカスを使用してリストをスクロールする際、D-pad でリストをスクロールし、選択キーでリスト内の項目を選択できることを確認する。また、ユーザーがリスト内の要素を選択できること、選択した後もリストがスクロールすることを確認する。
- コントロール間の切り替え操作がわかりやすく、予測可能であることを確認する。
方向ナビゲーションを修正する
Android のフレームワークでは、レイアウト内にあるフォーカス可能な要素の相対位置に基づいて、方向ナビゲーション スキームが自動的に適用されます。したがって、D-pad コントローラを使用してアプリ内に生成されたナビゲーション スキームをテストする必要があります。テスト後に、ある特定の方法でユーザーがレイアウト内を移動できるようにしたい場合には、コントロールに対して方向ナビゲーションを明示的にセットアップできます。
注: これらの属性を使ってナビゲーション順序を変更するのは、システムによって適用されたデフォルトの順序がうまく動作しない場合だけにしてください。
TextView レイアウト オブジェクトについて、隣のコントロールがフォーカスを受け取るように定義する方法を次のサンプルコードに示します。
<TextView android:id="@+id/Category1"
android:nextFocusDown="@+id/Category2"\>
次の表は、Android ユーザー インターフェース ウィジェットで使用可能なナビゲーションの属性一覧を示しています。
| 属性 | 機能 |
|---|---|
nextFocusDown |
ユーザーが下に移動したときにフォーカスを受け取る隣のビューを定義します。 |
nextFocusLeft |
ユーザーが左に移動したときにフォーカスを受け取る隣のビューを定義します。 |
nextFocusRight |
ユーザーが右に移動したときにフォーカスを受け取る隣のビューを定義します。 |
nextFocusUp |
ユーザーが上に移動したときにフォーカスを受け取る隣のビューを定義します。 |
この明示的なナビゲーション属性のいずれかを使用するには、値をレイアウト内にある別のウィジェットの ID（android:id 値）に設定します。ナビゲーションの順序はループとして設定する必要があります。これにより最後のコントロールから最初のコントロールにフォーカスが戻ります。
明確なフォーカスと選択を可能にする
テレビデバイスのアプリのナビゲーション スキームで重要なのは、画面上のどのユーザー インターフェース要素にフォーカスがあるかをユーザーが簡単に判別できるようにすることです。フォーカスされているアイテムが明確でないと、ユーザーはどのアイテムに対してアクションが可能かを判別できず、ストレスを感じてアプリを終了してしまうことになりかねません。同じ理由で、アプリの起動直後やアイドル状態のときも、ユーザーによるアクションが可能なフォーカス状態のアイテムが常に示されている状態にしておくことが重要です。
次に可能なアクションをユーザーが簡単に判別できるように、アプリのレイアウトと実装で色、サイズ、アニメーションや、こうした属性の組み合わせを使用することをおすすめします。アプリ内では、一貫したスキームを使用してフォーカス状態を示すようにしてください。
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>
1 つ前の状態リストのドローアブルを Button に適用する方法を次のレイアウト XML サンプルコードに示します。
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@drawable/button" />
周囲のハイライトがはっきりと見えるように、フォーカスおよび選択可能なコントロール内には十分なパディングを確保してください。
テレビアプリに適した効率的な選択機能やフォーカスを設計する際の推奨事項については、Android TV 向けデザインをご覧ください。