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 の開発原則の多くは、TV にも当てはまります。宣言型 UI フレームワークの一般的なメリットについて詳しくは、Compose を導入する理由をご覧ください。詳細については、GitHub の Compose for TV サンプル リポジトリもご覧ください。
互換性
Compose for TV は、Android 5.0(API レベル 21)以降を搭載した Android TV で動作します。Compose for TV のバージョン 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 を使用するには、次のように Jetpack Compose ツールキットの依存関係をアプリの build.gradle
ファイルに含めます。
Kotlin
dependencies { val composeBom = platform("androidx.compose:compose-bom:2024.06.00") implementation(composeBom) // General compose dependencies. implementation("androidx.activity:activity-compose:1.9.0") 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-rc01") }
Groovy
dependencies { def composeBom = platform('androidx.compose:compose-bom:2024.06.00') implementation composeBom // General compose dependencies. implementation 'androidx.activity:activity-compose:1.9.0' 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-rc01' }
相違点
可能な限り、TV 版の API を使用してください。モバイル版の 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 |
参考情報
TV Material Catalog サンプル
Compose for TV を使用してマテリアル デザインの原則を実装する方法を示すカタログアプリ。JetStream サンプル
一般的なマテリアル アプリと実際のアーキテクチャで TV Compose を使用するメディア ストリーミング アプリ。Compose for TV の概要
この Codelab では、カタログ ブラウザ画面と詳細画面を備えた動画プレーヤー アプリを作成する手順を説明します。
参考資料
テレビ向けに最適化された優れたエクスペリエンスの構築について詳しくは、以下のガイドをご覧ください。