Android-Geräte lassen sich nahtlos auf verbundene Displays erweitern

Wir freuen uns, einen wichtigen Meilenstein auf dem Weg zu einer engeren Verknüpfung von mobilen und Desktop-Computern unter Android bekannt zu geben: Die Unterstützung für verbundene Displays ist mit der Veröffentlichung von Android 16 QPR3 allgemein verfügbar.

Wie auf der Google I/O 2025 gezeigt, können Nutzer ihre Android-Geräte mit verbundenen Displays an einen externen Monitor anschließen und sofort auf eine Desktop-Fensterumgebung zugreifen. Apps können in Freiform- oder maximierten Fenstern verwendet werden und Nutzer können wie auf einem Desktop-Betriebssystem mehrere Aufgaben gleichzeitig erledigen.

Google und Samsung haben zusammengearbeitet, um Geräten im Android-Ökosystem, auf denen Android 16 ausgeführt wird, eine nahtlose und leistungsstarke Desktop-Freiform-Fensterfunktion zu bieten, wenn sie mit einem externen Bildschirm verbunden sind. 
Diese Funktion ist jetzt auf unterstützten Geräten* für Nutzer allgemein verfügbar, die ihre unterstützten Pixel- und Samsung-Smartphones mit externen Monitoren verbinden können. So ergeben sich neue Möglichkeiten, ansprechendere und produktivere App-Erlebnisse zu schaffen, die sich an verschiedene Formfaktoren anpassen.

Wie funktioniert das?

Wenn ein unterstütztes Android-Smartphone oder Falt-Smartphone mit einem externen Display verbunden ist, wird auf dem verbundenen Display eine neue Desktopsitzung gestartet.

Die Nutzung auf dem verbundenen Display ähnelt der Nutzung auf einem Desktop, einschließlich einer Taskleiste, in der aktive Apps angezeigt werden und Nutzer Apps für den schnellen Zugriff anpinnen können. Nutzer können mehrere Apps gleichzeitig nebeneinander in frei skalierbaren Fenstern auf dem verbundenen Display ausführen.

Smartphone ist mit einem externen Display verbunden, auf dem eine Desktopsitzung läuft, während das Smartphone seinen eigenen Status beibehält.

Wenn ein Gerät, das Desktop-Freiform-Fenster unterstützt (z. B. ein Tablet wie das Samsung Galaxy Tab S11), mit einem externen Display verbunden ist, wird die Desktopsitzung auf beide Displays erweitert, sodass ein noch größerer Arbeitsbereich entsteht. Die beiden Displays funktionieren dann als ein kontinuierliches System, sodass App-Fenster, Inhalte und der Cursor frei zwischen den Displays verschoben werden können.

Tablet mit einem externen Display verbunden, sodass die Desktopsitzung auf beide Displays erweitert wird.

Welchen Zweck erfüllt es?

In der Android 16 QPR3-Version haben wir die Fensterfunktionen, Taskleisteninteraktionen und Eingabekompatibilität (Maus und Tastatur) fertiggestellt, die die Nutzung von verbundenen Displays definieren. Außerdem haben wir Kompatibilitätsbehandlungen hinzugefügt, um Fenster zu skalieren und App-Neustarts beim Wechseln von Displays zu vermeiden.

Wenn Ihre App nach den Grundsätzen des responsiven Designs entwickelt wurde, hat sie automatisch das Desktop-Design und die Nutzer werden sich sofort zurechtfinden. Wenn die App auf das Hochformat beschränkt ist oder nur eine Touch-Oberfläche verwendet, ist es jetzt an der Zeit, sie zu modernisieren.

Achten Sie insbesondere auf die folgenden wichtigen Best Practices, um eine optimale App-Nutzung auf verbundenen Displays zu ermöglichen:

• Gehen Sie nicht von einem konstanten Display-Objekt aus:Das Display-Objekt, das mit dem Kontext Ihrer App verknüpft ist, kann sich ändern, wenn ein App-Fenster auf ein externes Display verschoben wird oder wenn sich die Displaykonfiguration ändert. Ihre App sollte Konfigurationsänderungsereignisse ordnungsgemäß verarbeiten und Display-Messwerte dynamisch abfragen, anstatt sie zu speichern.
• Änderungen an der Dichtekonfigurationberücksichtigen:Externe Displays können eine ganz andere Pixeldichte als das primäre Geräte-Display haben. Achten Sie darauf, dass sich Ihre Layouts und Ressourcen richtig an diese Änderungen anpassen, damit die Benutzeroberfläche klar und nutzerfreundlich bleibt. Verwenden Sie dichteunabhängige Pixel (dp) für Layouts, stellen Sie dichteabhängige Ressourcen bereit und sorgen Sie dafür, dass Ihre Benutzeroberfläche richtig skaliert wird.
• Externe Peripheriegeräte korrekt unterstützen: Wenn Nutzer eine Verbindung zu einem externen Monitor herstellen, schaffen sie oft eine desktopähnliche Umgebung. Dazu gehören häufig externe Tastaturen, Mäuse, Trackpads, Webcams, Mikrofone und Lautsprecher. Die Unterstützung für Tastatur- und Maus-Interaktionen wurde verbessert.

Mit modernen Tools für die Zukunft des Desktops entwickeln

Wir stellen Ihnen verschiedene Tools zur Verfügung, mit denen Sie die Desktop-Version erstellen können. Hier sind die neuesten Updates unserer wichtigsten adaptiven Bibliotheken.

Neue Fenstergrößenklassen: „Groß“ und „Extragroß“

Die wichtigste Neuerung in Jetpack WindowManager 1.5.0 ist die Einführung von zwei neuen Fenstergrößenklassen für die Breite: „Large“ und „Extra-large“.

Fenstergrößenklassen sind unsere offiziellen, meinungsbasierten Breakpoints für den Darstellungsbereich, die Ihnen beim Entwerfen und Entwickeln adaptiver Layouts helfen. Mit Version 1.5.0 erweitern wir diese Anleitung auf Bildschirme, die über die Größe typischer Tablets hinausgehen.

Hier sind die neuen Breiten-Breakpoints:

• Groß: für Breiten zwischen 1.200 dp und 1.600 dp
• Extragroß: Für Breiten ≥ 1.600 dp

Die verschiedenen Fenstergrößenklassen basierend auf der Displaybreite.

Auf sehr großen Oberflächen ist es nicht immer die beste Lösung, das Expanded-Layout eines Tablets einfach zu skalieren. Ein E‑Mail-Client kann beispielsweise in der Fenstergrößenklasse „Maximiert“ bequem zwei Bereiche (ein Postfach und eine Nachricht) anzeigen. Auf einem extragroßen Desktopmonitor könnte der E‑Mail-Client jedoch elegant drei oder sogar vier Bereiche gleichzeitig anzeigen, z. B. ein Postfach, eine Nachrichtenliste, den vollständigen Nachrichteninhalt und einen Kalender-/Aufgabenbereich.

Wenn Sie die neuen Fenstergrößenklassen in Ihr Projekt einbeziehen möchten, rufen Sie die Funktion einfach aus dem Set WindowSizeClass.BREAKPOINTS_V2 anstelle von WindowSizeClass.BREAKPOINTS_V1 auf:

val currentWindowMetrics =
    WindowMetricsCalculator.getOrCreate()
    .computeCurrentWindowMetrics(LocalContext.current)

val sizeClass = WindowSizeClass.BREAKPOINTS_V2
    .computeWindowSizeClass(currentWindowMetrics)

Wenden Sie dann das richtige Layout an, wenn Sie sicher sind, dass Ihre App mindestens so viel Platz hat:

if(sizeClass.isWidthAtLeastBreakpoint(
    WindowSizeClass.WIDTH_DP_LARGE_LOWER_BOUND)){
    ...
	// Window is at least 1200 dp wide.
}

Adaptive Layouts mit Jetpack Navigation 3 erstellen

Navigation 3 ist die neueste Ergänzung der Jetpack-Sammlung. Navigation 3, das gerade seinen ersten stabilen Release erreicht hat, ist eine leistungsstarke Navigationsbibliothek, die für die Verwendung mit Compose entwickelt wurde.

Navigation 3 ist auch ein hervorragendes Tool zum Erstellen adaptiver Layouts, da mehrere Ziele gleichzeitig angezeigt und nahtlos zwischen diesen Layouts gewechselt werden kann.

Dieses System zum Verwalten des UI-Ablaufs Ihrer App basiert auf Szenen. Eine Szene ist ein Layout, in dem ein oder mehrere Ziele gleichzeitig angezeigt werden. Eine SceneStrategy bestimmt, ob eine Szene erstellt werden kann. Durch das Verketten von SceneStrategy-Instanzen können Sie verschiedene Szenen für unterschiedliche Bildschirmgrößen und Gerätekonfigurationen erstellen und anzeigen.

Für sofort einsatzbereite kanonische Layouts wie Listen-Detailansicht und unterstützenden Bereich können Sie die Szenen aus der Compose Material 3 Adaptive-Bibliothek verwenden (verfügbar in Version 1.3 und höher).

Sie können auch ganz einfach eigene benutzerdefinierte Szenen erstellen, indem Sie die Szenenrezepte ändern oder von Grund auf neu beginnen. Betrachten wir beispielsweise eine Szene, in der drei Bereiche nebeneinander angezeigt werden:

class ThreePaneScene<T : Any>(
    override val key: Any,
    override val previousEntries: List<NavEntry<T>>,
    val firstEntry: NavEntry<T>,
    val secondEntry: NavEntry<T>,
    val thirdEntry: NavEntry<T>
) : Scene<T> {
    override val entries: List<NavEntry<T>> = listOf(firstEntry, secondEntry, thirdEntry)
    override val content: @Composable (() -> Unit) = {
        Row(modifier = Modifier.fillMaxSize()) {
            Column(modifier = Modifier.weight(1f)) {
                firstEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                secondEntry.Content()
            }
            Column(modifier = Modifier.weight(1f)) {
                thirdEntry.Content()
            }
        }
    }

In diesem Fall können Sie eine SceneStrategy definieren, um drei Bereiche anzuzeigen, wenn die Fensterbreite groß genug ist und die Einträge in Ihrem Backstack deklariert haben, dass sie in einer dreispaltigen Szene angezeigt werden können.

class ThreePaneSceneStrategy<T : Any>(val windowSizeClass: WindowSizeClass) : SceneStrategy<T> {
    override fun SceneStrategyScope<T>.calculateScene(entries: List<NavEntry<T>>): Scene<T>? {
        if (windowSizeClass.isWidthAtLeastBreakpoint(WIDTH_DP_LARGE_LOWER_BOUND)) {
            val lastThree = entries.takeLast(3)
            if (lastThree.size == 3 && lastThree.all { it.metadata.containsKey(MULTI_PANE_KEY) }) {
                val firstEntry = lastThree[0]
                val secondEntry = lastThree[1]
                val thirdEntry = lastThree[2]


                return ThreePaneScene(
                    key = Triple(firstEntry.contentKey, secondEntry.contentKey, thirdEntry.contentKey),
                    previousEntries = entries.dropLast(3),
                    firstEntry = firstEntry,
                    secondEntry = secondEntry,
                    thirdEntry = thirdEntry
                )
            }
        }
        return null
    }
}

Sie können Ihre ThreePaneSceneStrategy beim Erstellen von NavDisplay mit anderen Strategien kombinieren. Wir könnten beispielsweise auch eine TwoPaneStrategy hinzufügen, um zwei Bereiche nebeneinander anzuzeigen, wenn nicht genügend Platz für drei vorhanden ist.

val strategy = ThreePaneSceneStrategy() then TwoPaneSceneStrategy()

NavDisplay(..., 
  sceneStrategy = strategy,
  entryProvider = entryProvider { 
    entry<MyScreen>(metadata = mapOf(MULTI_PANE_KEY to true))) { ... }
    ... other entries...
  }
)

Wenn nicht genügend Platz für die Anzeige von drei oder zwei Bereichen vorhanden ist, geben beide benutzerdefinierten Szenenstrategien null zurück. In diesem Fall wird mit NavDisplay der letzte Eintrag im Backstack in einem einzelnen Bereich mit SinglePaneScene angezeigt. 

Mit Szenen und Strategien können Sie Ihrer App Layouts mit einem, zwei und drei Bereichen hinzufügen.

Eine adaptive App mit dreispaltiger Navigation auf breiten Bildschirmen.

Weitere Informationen zum Erstellen benutzerdefinierter Layouts mit Szenen in Navigation 3

Eigenständige adaptive Layouts

Wenn Sie ein eigenständiges Layout benötigen, können Sie mit der Compose Material 3 Adaptive-Bibliothek adaptive UIs wie Listen-Detailansicht- und unterstützende Bereichslayouts erstellen, die sich automatisch an Fensterkonfigurationen anpassen, basierend auf Fenstergrößenklassen oder Gerätepositionen. 

Die gute Nachricht ist, dass die Bibliothek bereits auf dem neuesten Stand ist und die neuen Breakpoints enthält. Ab Version 1.2 unterstützen die Standard-Pane-Scaffold-Direktiven die Fenstergrößenklassen „Groß“ und „Extragroß“.

Sie müssen die neuen Breakpoints nur aktivieren, indem Sie in Ihrer Gradle-Build-Datei deklarieren, dass Sie sie verwenden möchten:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

Erste Schritte

Die Funktion „Verbundenes Display“ ist in der neuesten Android-Version verfügbar. Android 16 QPR3 auf einem unterstützten Gerät installieren und es dann an einen externen Monitor anschließen, um noch heute mit dem Testen Ihrer App zu beginnen. 

In der aktualisierten Dokumentation zur Unterstützung mehrerer Displays und zur Fensterverwaltung finden Sie weitere Informationen zur Implementierung dieser Best Practices.

Feedback

Ihr Feedback ist für uns sehr wichtig, da wir die Desktop-Oberfläche für verbundene Displays weiter optimieren möchten. Über unsere offiziellen Feedback-Kanäle kannst du uns deine Meinung mitteilen und Probleme melden.

Wir möchten Android zu einer vielseitigen Plattform machen, die sich an die vielen Arten anpasst, wie Nutzer mit ihren Apps und Geräten interagieren möchten. Die Verbesserungen der Unterstützung für verbundene Displays sind ein weiterer Schritt in diese Richtung. Wir sind davon überzeugt, dass Ihre Nutzer die Desktop-Erlebnisse, die Sie entwickeln, lieben werden.

*Hinweis:Zum Zeitpunkt der Erstellung dieses Artikels werden verbundene Displays auf Geräten der Pixel 8-, 9- und 10-Serie sowie auf einer Vielzahl von Samsung-Geräten unterstützt, darunter S26, Fold7, Flip7 und Tab S11.