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. Das Erstellen ansprechender und funktionaler Benutzeroberflächen für Ihre App ist dadurch viel einfacher.

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 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 das Schreiben von Texten für Mobilgeräte gelten auch für das Fernsehen. Weitere Informationen zu den allgemeinen Vorteilen eines deklarativen UI-Frameworks finden Sie unter Gründe für Compose. Weitere Informationen finden Sie im Repository mit Compose for TV-Beispielen auf GitHub.

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

Jetpack Compose wird auf Android TV ähnlich wie Jetpack Compose für andere Android-Projekte verwendet. Der Hauptunterschied besteht darin, dass Compose for TV Bibliotheken mit für Fernseher optimierten Komponenten hinzufügt und das Erstellen von für Fernseher optimierten Benutzeroberflächen erleichtert. 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 for TV verwenden möchten, fügen Sie die Abhängigkeiten des Jetpack Compose-Toolkits so in die build.gradle-Datei Ihrer App ein:

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 spezifischen Komponenten findest du in den TV-UI-Designleitfäden.

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

Es ist zwar technisch möglich, die mobile Version von „Material verfassen“ zu verwenden, sie ist aber nicht für den besonderen Interaktionsstil von 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 sind die Unterschiede zwischen TV und Mobilgeräten aufgeführt:

Weitere Informationen

• TV-Designleitfäden
  Eine Übersicht über dedizierte 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 TV-optimierte Inhalte erstellen für:

• Katalogsuchbildschirm
• Detailbildschirm