Skip to content

Most visited

Recently visited

navigation

TV 向けレイアウトをビルドする

TV スクリーンは 10 フィートほど離れて見ることが通常であり、他の Android 端末のディスプレイよりもはるかに大きいことが多く、小型の端末と同レベルの精度と色を再現できません。便利で楽しいユーザー エクスペリエンスを作成する上で、これらの要素を配慮して TV 端末向けアプリのレイアウトを作成する必要があります。

このレッスンでは、TV アプリ用の効果的なレイアウトをビルドするための最低限の要件と実装の詳細を説明します。

TV 向けのレイアウト テーマを使用する

Android のテーマは、TV アプリのレイアウトの基礎を提供しています。TV 端末上で動作するよう設計されたアプリのアクティビティに関しては、テーマを使用して表示を変更する必要があります。このセクションでは、どのテーマを使用したらよいかについて説明します。

Leanback テーマ

TV ユーザー インターフェースのサポート ライブラリである v17 leanback ライブラリ は、Theme.Leanback という TV アクティビティに関する標準的なテーマを提供しています。このテーマは、TV アプリに一貫性のある視覚的なスタイルを与えます。ほとんどの TV アプリにはこのテーマをお勧めします。このテーマは v17 leanback クラスを使用するすべての TV アプリに最適です。次のコード例では、アプリ内にあるアクティビティにこのテーマを適用する方法を示します。

<activity
  android:name="com.example.android.TvActivity"
  android:label="@string/app_name"
  android:theme="@style/Theme.Leanback">

NoTitleBar テーマ

タイトル バーは、携帯電話やタブレットの Android アプリにとっては標準的なユーザー インターフェース エレメントですが、TV アプリには適していません。v17 leanback クラスを使用していない場合は、TV アクティビティにこのテーマを適用してタイトル バーの表示を控える必要があります。TV アプリのマニフェストに関する次のコード例では、このテーマを適用してタイトル バーの表示を削除する方法を示します。

<application>
  ...

  <activity
    android:name="com.example.android.TvActivity"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.NoTitleBar">
    ...

  </activity>
</application>

基本的な TV レイアウトをビルドする

TV 端末用のレイアウトが、大きなスクリーンでも使いやすく効果的になるように、参考となるガイドラインがいくつかあります。次のヒントに従って、TV スクリーン用に最適化された横長のレイアウトをビルドします。

オーバースキャン

TV 向けのレイアウトには、TV 規格の進化と、常に視聴者にフルスクリーン表示を提供したいという開発者側の意図に伴い、いくつかの特殊な要件があります。このため、TV 端末ではフルスクリーン表示の際にディスプレイ全体を埋められるように、アプリのレイアウト周囲がクリッピングされる場合があります。この動作を、一般にオーバースキャンと呼びます。

レイアウト周囲には 10%のマージンを与え、スクリーン エレメントがオーバースキャンによりクリッピングされないようにします。具体的には、アクティビティのベース レイアウトの左右には 27dp、上下には 48dp のマージンを設定します。次のレイアウト例では、TV アプリのルート レイアウト内でこれらのマージンを設定する方法を示します。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/base_layout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  android:layout_marginTop="27dp"
  android:layout_marginLeft="48dp"
  android:layout_marginRight="48dp"
  android:layout_marginBottom="27dp" >
</LinearLayout>

警告:BrowseFragment や関連ウィジェットなどの v17 leanback クラスを使用している場合、レイアウトには既にオーバースキャン用のマージンが設定されているため、重複して設定しないようにします。

使用可能なテキストとコントロールをビルドする

TV アプリのレイアウト内のテキストやコントロールは、遠くからでも見やすく、操作内容を理解できるようにする必要があります。次のヒントに従って、遠くから見ても簡単に判別可能なユーザー インターフェース エレメントを作成します。

密度に依存しないピクセルと、スクリーン サイズが大きな場合のレイアウトのビルドについては、複数のスクリーンをサポートするを参照してください。

TV のレイアウト リソースを管理する

一般的なハイビジョン TV ディスプレイの解像度は 720p、1080i、1080p です。TV のレイアウトが 1920×1080 ピクセルのスクリーン サイズになるようにして、Android のシステムが必要に応じてアプリのレイアウト エレメントを 720p にダウンスケールできるようにします。通常は、ダウンスケーリング(ピクセル削除)してもレイアウトのプレゼンテーション品質が低下することはありません。ただし、アップスケーリングはレイアウトの品質を劣化させ、アプリのユーザー エクスペリエンスに悪影響を与えるアーチファクトを引き起こす可能性があります。

画像を最適な状態にスケーリングするには、可能であれば 9patch 画像のエレメントとして配置します。レイアウト内に低品質な画像や小さな画像を配置した場合、ピクセル化され、ぼやけた、粗い表示になり、ユーザー エクスペリエンスの低下につながります。それを避けるには、高品質の画像を使用します。

大きなスクリーン向けのレイアウトやリソースの最適化については、複数のスクリーンをデザインするを参照してください。

レイアウトのアンチパターンを回避する

TV 端末には不向きでユーザー エクスペリエンスの低下につながるため、レイアウトのビルドに際して避けたほうがよいアプローチがいくつかあります。ここでは、TV のレイアウト開発の際に特に使用しないほうがよい、ユーザー インターフェースに関するアプローチをいくつか説明します。

TV に適したレイアウトのデザインについては、TV 向けデザインガイドを参照してください。

大容量のビットマップを処理する

他の Android 端末と同様に、TV 端末ではメモリ容量が限られています。超高解像度の画像を使用してアプリのレイアウトをビルドしたり、アプリの動作に多くの高解像度の画像を使用した場合、すぐにメモリの上限に達し、メモリ不足エラーが発生する可能性があります。次のヒントに従って、このタイプの問題を回避します。

画像処理の際に最高のパフォーマンスを得るには、ビットマップを効率的に表示するを参照してください。

This site uses cookies to store your preferences for site-specific language and display options.

Get the latest Android developer news and tips that will help you find success on Google Play.

* Required Fields

Hooray!

WeChat で Google Developers をフォローする

Browse this site in ?

You requested a page in , but your language preference for this site is .

Would you like to change your language preference and browse this site in ? If you want to change your language preference later, use the language menu at the bottom of each page.

This class requires API level or higher

This doc is hidden because your selected API level for the documentation is . You can change the documentation API level with the selector above the left navigation.

For more information about specifying the API level your app requires, read Supporting Different Platform Versions.

Take a short survey?
Help us improve the Android developer experience. (Dec 2017 Android Platform & Tools Survey)