Jetpack Compose auf Android TV verwenden

Compose for TV ist der moderne Ansatz für die Erstellung von Android TV-Benutzeroberflächen. Mit Compose for TV können Sie alle Vorteile von Jetpack Compose von Android für Ihre TV-Apps nutzen. So lassen sich ansprechende und funktionale Benutzeroberflächen für Ihre App viel einfacher erstellen.

Compose for TV bietet unter anderem folgende Vorteile:

• Flexibilität: Mit Compose können Sie jede Art von Benutzeroberfläche erstellen, von einfachen Layouts bis hin zu komplexen Animationen. Die Komponenten sind sofort einsatzbereit, können aber auch an die Anforderungen Ihrer App angepasst und gestaltet werden.
• Vereinfachte und beschleunigte Entwicklung: Compose ist mit vorhandenem Code kompatibel und ermöglicht es Entwicklern, Apps mit weniger Code effizienter zu erstellen.
• Intuitiv: Compose verwendet eine deklarative Syntax, mit der Sie Änderungen an Ihrer Benutzeroberfläche vornehmen, Ihren Code debuggen, verstehen und überprüfen können.

Wenn Sie mit dem Jetpack Compose-Toolkit nicht vertraut sind, sehen Sie sich den Compose-Lernpfad an. Viele der Entwicklungsprinzipien für Compose auf Mobilgeräten gelten auch für Fernseher. Weitere Informationen zu den allgemeinen Vorteilen eines deklarativen UI-Frameworks finden Sie unter Vorteile von Compose. Weitere Informationen finden Sie im Repository mit Compose for TV-Beispielen auf GitHub.

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


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

Kompatibilität

„Für TV erstellen“ funktioniert auf Android-Fernsehern mit Android 5.0 (API-Level 21) oder höher. Für die Verwendung von Version 1.0 von Compose for TV sind Version 1.3.0 der androidx.compose-Bibliotheken und Kotlin 1.7.10 erforderlich.

Einrichten

Die Verwendung von Jetpack Compose auf Android TV ähnelt der Verwendung von Jetpack Compose für jedes andere Android-Projekt. Der Hauptunterschied besteht darin, dass Compose for TV Bibliotheken hinzufügt, die für Fernseher optimierte Komponenten bieten und das Erstellen von für Fernseher optimierten Benutzeroberflächen erleichtern. In einigen Fällen haben diese Komponenten denselben Namen wie ihre Pendants, die nicht für Fernseher gedacht sind, z. B. androidx.tv.material3.Button und androidx.compose.material3.Button.

Abhängigkeiten des Jetpack Compose-Toolkits

Wenn Sie Compose für Fernseher verwenden möchten, fügen Sie der Datei build.gradle Ihrer App die Abhängigkeiten des Jetpack Compose-Toolkits folgendermaßen hinzu:

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

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

   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")
}

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

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

   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'
}

Unterschiede

Die Komponenten für TV-Material sind für das Wohnzimmer konzipiert, mit eindeutigen Fokusindikatoren und eingabenfreundlichem Verhalten. Weitere Informationen zur Verwendung dieser speziellen Komponenten finden Sie in den Designleitfäden für TV-UIs.

Verwende nach Möglichkeit die TV-Version der APIs, um von diesen Funktionen zu profitieren.

Die mobile Version von Compose Material kann zwar technisch verwendet werden, ist aber nicht für die speziellen Interaktionen auf Android TV optimiert. Außerdem kann die Kombination von Compose-Material mit Compose-Material aus Compose for TV zu unerwartetem Verhalten führen. Da jede Bibliothek ein eigenes MaterialTheme-Objekt hat, kann es beispielsweise zu Inkonsistenzen bei Farben, Typografie oder Formen kommen, wenn beide Versionen verwendet werden.

In der folgenden Tabelle werden die Unterschiede bei Abhängigkeiten zwischen TV und Mobilgeräten beschrieben:

Weitere Informationen

• Designleitfäden für Fernseher
  Eine Übersicht über spezielle TV-Komponenten zum Erstellen von Benutzeroberflächen mit Links zu relevanten Entwicklerressourcen.

• Material Catalog-Beispiel für Fernseher
  Eine Katalog-App, die zeigt, wie die Prinzipien von Material Design mit Compose for TV implementiert werden.

• JetStream-Beispiel
  Eine Medienstreaming-App, die die Verwendung von TV Compose mit einer typischen Material App und einer realen Architektur veranschaulicht.

• Einführung in Compose for TV
  In diesem Codelab wird Schritt für Schritt gezeigt, wie Sie eine Videoplayer-App mit einem Katalog-Browser-Bildschirm und einem Detailbildschirm erstellen.

Weitere Informationen

In diesen Leitfäden erfahren Sie, wie Sie für folgende Geräte eine optimale Nutzererfahrung auf dem Fernseher schaffen:

• Katalogsuchbildschirm
• Detailbildschirm