Android TV で Jetpack Compose を使用する

Compose for TV は、Android TV のユーザー インターフェースを構築するための最新のアプローチです。Compose for TV を使用すると、Android の Jetpack Compose のすべてのメリットを TV アプリで活用できるため、アプリの美しく機能性の高い UI の作成が容易になります。

Compose for TV の具体的なメリットは次のとおりです。

  • 柔軟性: Compose を使用すると、シンプルなレイアウトから複雑なアニメーションまで、あらゆる種類の UI を作成できます。コンポーネントはすぐに使用できますが、アプリのニーズに合わせたカスタマイズやスタイル設定も可能です。
  • 開発の簡素化と迅速化: Compose は既存のコードと互換性があるため、デベロッパーは少ないコードでアプリをより効率的に構築できます。
  • 直感的: Compose では、UI の変更とコードのデバッグ、理解、レビューを直感的に行える宣言型構文が使用されています。

Jetpack Compose ツールキットの使用に慣れていない場合は、Compose のパスウェイをご覧ください。モバイル向け Compose の開発原則の多くは、テレビにも当てはまります。宣言型 UI フレームワークの一般的なメリットについて詳しくは、Compose を導入する理由をご覧ください。詳しくは、GitHub の Compose for TV サンプル リポジトリもご覧ください。

AI プロンプト

Android TV のサポートを追加する方法を学ぶ

このプロンプトは、Leanback ではなく Jetpack Compose for TV を使用してアプリに Android TV サポートを追加する方法についてガイダンスを求めるものです。

How do I add support for Android TV to my application?



Use Jetpack Compose for TV as part of the response instead of Leanback.

AI プロンプトの使用

AI プロンプトは、Gemini in Android Studio（最新の Canary バージョンが必要）内で使用することを目的としています。

Studio での Gemini の詳細については、https://developer.android.com/studio/preview/gemini をご覧ください。

互換性

Compose for TV は、Android 5.0（API レベル 21）以降を搭載した Android TV で動作します。TV 向け Compose のバージョン 1.0 を使用するには、androidx.compose ライブラリのバージョン 1.3.0 と Kotlin 1.7.10 が必要です。

設定

Android TV で Jetpack Compose を使用することは、他の Android プロジェクトで Jetpack Compose を使用することと似ています。主な違いは、Compose for TV では TV 向けに最適化されたコンポーネントを提供するライブラリが追加され、TV 向けにカスタマイズしたユーザー インターフェースを簡単に作成できる点です。場合によっては、これらのコンポーネントがテレビ以外のコンポーネントと同じ名前を共有することもあります（androidx.tv.material3.Button や androidx.compose.material3.Button など）。

Jetpack Compose ツールキットの依存関係

Compose for TV を使用するには、アプリの build.gradle ファイルに Jetpack Compose ツールキットの依存関係を次のように追加します。

Kotlin

dependencies {
   val composeBom = platform("androidx.compose:compose-bom:2025.05.00")
   implementation(composeBom)

   // General compose dependencies.
   implementation("androidx.activity:activity-compose:1.10.1")

   implementation("androidx.compose.ui:ui-tooling-preview")
   debugImplementation("androidx.compose.ui:ui-tooling")

   // Compose for TV dependencies.
   implementation("androidx.tv:tv-material:1.0.0")
}

Groovy

dependencies {
   def composeBom = platform('androidx.compose:compose-bom:2025.05.00')
   implementation composeBom

   // General compose dependencies.
   implementation 'androidx.activity:activity-compose:1.10.1'

   implementation 'androidx.compose.ui:ui-tooling-preview'
   debugImplementation 'androidx.compose.ui:ui-tooling'

   // Compose for TV dependencies.
   implementation 'androidx.tv:tv-material:1.0.0'
}

相違点

テレビのマテリアル コンポーネントは、リビングルームでの使用を想定して設計されており、明確なフォーカス インジケーターとリモコン操作に適した入力動作を備えています。これらの特定のコンポーネントの使用方法について詳しくは、テレビの UI 設計ガイドをご覧ください。

図 1. TV マテリアル ライブラリのサンプル コンポーネント。

これらの機能を利用するには、可能な限り API の TV バージョンを使用してください。

モバイル版の Compose Material を使用することも技術的には可能ですが、Android TV 固有のインタラクション スタイルに合わせて最適化されているわけではありません。また、Compose Material と Compose for TV の Compose Material を混在させると、予期しない動作が発生する可能性があります。たとえば、各ライブラリに独自の MaterialTheme オブジェクトがあるため、両方のバージョンを使用した場合、色、タイポグラフィ、図形に一貫性がなくなる可能性があります。

次の表に、テレビとモバイルの依存関係の違いを示します。

TV の依存関係
（androidx.tv.*） 		比較 モバイルの依存関係
（androidx.compose.*）
androidx.tv:tv-material 変更 androidx.compose.material3:material3

参考情報

参考資料

以下のガイドでは、テレビに最適化された優れたエクスペリエンスを構築する方法について説明します。

次へ
カタログ ブラウザを作成する