Picture-in-Picture in mobilen Anwendungen — was es ist, wie es funktioniert und wo es eingesetzt wird

Was ist Picture-in-Picture?

Picture-in-Picture (PiP) ist ein Videoanzeigemodus, der Inhalte in einem kleinen schwebenden Fenster zeigt, das über allen anderen Fenstern und Anwendungen bleibt. Der Nutzer kann das PiP-Fenster auf dem Bildschirm verschieben, seine Größe ändern (auf einigen Plattformen) und während der Arbeit in anderen Anwendungen weiterhin Inhalte ansehen.

Das PiP-Konzept stammt aus dem Fernsehen: Bereits in den 1990er Jahren konnten Fernsehgeräte einen zweiten Kanal in einer Ecke des Bildschirms anzeigen. Auf mobilen Geräten erschien PiP erstmals auf dem iPad mit iOS 9 (2015) für Safari-Videos, während vollständiges systemweites PiP für Apps mit iOS 14 (2020) verfügbar wurde. Die PiP-Unterstützung auf Android kam früher — in Version 8.0 Oreo (2017), aber nur für Video, und ab Android 12 für alle Inhaltstypen.

PiP unterscheidet sich von der Hintergrundwiedergabe dadurch, dass das Video weiterhin auf dem Bildschirm angezeigt wird und nicht nur im Audiostream abgespielt wird. Die Hintergrundaudiowiedergabe ist auf beiden Plattformen verfügbar, aber PiP gibt dem Nutzer visuelle Kontrolle über den Inhalt: Er kann Bilder sehen, pausieren, zurückspulen oder das Fenster schließen. Dies ist besonders wichtig für Video-Tutorials, Streams und Videoanrufe, bei denen visuelle Inhalte ebenso wichtig sind wie Audio.

Wie funktioniert PiP?

Architektonisch wird PiP über einen Systemfenster-Manager implementiert, der ein separates Fenster mit niedrigerer Anzeigepriorität erstellt. Die App delegiert die Videoausgabe an einen Systemdienst, der das Video auch dann weiter rendert, nachdem die App in den Hintergrund gewechselt oder minimiert wurde.

Lebenszyklus einer PiP-Sitzung

Der Prozess beginnt, wenn der Nutzer die App mit aktivem Video minimiert oder die PiP-Taste drückt (auf iOS), oder das System automatisch die Activity in den PiP-Modus versetzt (auf Android). Der Systemfenster-Manager erfasst den Videostream und erstellt ein schwebendes Fenster mit festen Proportionen. Die Fenstergröße hängt vom Seitenverhältnis des Originalvideos und den Plattformbeschränkungen ab: Auf iOS nimmt das PiP-Fenster etwa 1/6–1/4 der Bildschirmbreite ein; auf Android mindestens 108 dp Breite und 240 dp Höhe für mobile Geräte.

Wenn das PiP-Fenster aktiv ist, kann sich die App in einem von drei Zuständen befinden: im Hintergrund (minimiert), im aktiven Zustand (Nutzer kehrte zur App zurück) oder im Wartezustand (System pausierte PiP aufgrund von Ressourcenmangel). Beim Übergang zu PiP sollte die App unnötige UI-Operationen (Animationen, Benutzeroberflächen-Rendering) pausieren und Speicher freigeben, da Systemressourcen im Multitasking-Modus strenger zugewiesen werden. iOS sendet der App automatisch eine AVPictureInPictureControllerWillStartNotification, während Android den Callback onPictureInPictureModeChanged sendet.

Einschränkungen des PiP-Modus

Das PiP-Fenster hat erhebliche Einschränkungen: Es kann keine standardmäßigen UI-Steuerelemente (Pause-Taste, Fortschrittsbalken) anzeigen — nur eine minimale Systemüberlagerung mit grundlegenden Steuerelementen: Play/Pause, Schließen, auf Vollbild erweitern. Die System-PiP-Oberfläche auf iOS enthält Pause- und Schließen-Tasten, während Android dieselben Elemente plus eine zusätzliche Einstellungstaste enthält. Eine Interaktion mit dem Inhalt innerhalb von PiP (Zurückspulen, Auswahl von Untertiteln) ist nicht möglich — dafür muss die App auf Vollbild erweitert werden.

PiP auf iOS: Implementierung und Einschränkungen

Auf iOS wird PiP über das AVKit-Framework und die Klasse AVPictureInPictureController implementiert. Diese API ist auf iOS 14+ für iPhone und iPad verfügbar, jedoch mit unterschiedlichen Anforderungen: Auf dem iPad funktioniert PiP über AVPlayerLayer, auf dem iPhone nur über AVPlayerViewController.

Anforderungen für PiP auf iOS

Damit PiP auf iOS funktioniert, müssen mehrere Bedingungen erfüllt sein: Die App muss AVPlayer für die Videowiedergabe verwenden, die Audiositzung muss auf die Kategorie .playback oder .playAndRecord eingestellt sein, und die App muss Berechtigungen für Hintergrundaudio haben (UIBackgroundModes = audio). Ohne diese Einstellungen startet PiP nicht — das System lehnt die PiP-Sitzungsanfrage ab, da es eine korrekte Wiedergabe nach dem Wechsel in den Hintergrund nicht garantieren kann.

Auf iOS erscheint das PiP-Fenster automatisch beim Minimieren der App, wenn das Video aktiv abgespielt wird und der Nutzer diese Funktion nicht in den Einstellungen deaktiviert hat. Der Nutzer kann das Video auch manuell über die Taste in AVPlayerViewController in PiP minimieren. Die Größe des PiP-Fensters auf iOS ist fest und wird vom System bestimmt — der Entwickler kann sie nicht ändern. Das Seitenverhältnis des PiP-Fensters entspricht dem des Originalvideos, aber die maximale Größe ist auf 1/4 der Bildschirmbreite auf dem iPhone und 1/3 auf dem iPad begrenzt.

iOS PiP-Einschränkungen

Die wichtigsten PiP-Einschränkungen auf iOS: Keine benutzerdefinierte UI im PiP-Fenster, nur ein PiP-Stream gleichzeitig und die Notwendigkeit eines aktiven AVPlayer für PiP. Multi-PiP — gleichzeitige Wiedergabe mehrerer PiP-Fenster — wird auf iOS nicht unterstützt. Beim Versuch, ein zweites PiP zu starten, wird das erste automatisch geschlossen. Dies ist eine Hardware-Einschränkung: Der Videoprozessor kann aufgrund von DMA- und Videospeicherbeschränkungen nicht zwei unabhängige PiP-Kanäle gleichzeitig bedienen.

Eine weitere wichtige Einschränkung ist die Dauer der Hintergrundwiedergabe. Wenn der Nutzer nicht mit dem PiP-Fenster interagiert, kann das System die Wiedergabe nach einiger Zeit zur Energieeinsparung pausieren. Die automatische PiP-Pause auf iOS tritt nach 10–15 Minuten Inaktivität ein, wenn die App keinen Keep-Alive-Mechanismus über eine Hintergrundaufgabe implementiert hat. Für Videoanrufe und Streams wird die Verwendung von PushKit und VoIP-Zertifikaten empfohlen, die diese Einschränkung umgehen.

PiP auf Android: Implementierung und Einschränkungen

Auf Android wird PiP als integrierter Activity-Modus implementiert, der über die Methode enterPictureInPictureMode aktiviert wird. Seit Android 8.0 (API 26) kann jede Activity in den PiP-Modus wechseln, und seit Android 12 (API 31) gibt es PiP-Unterstützung für SurfaceView und TextureView ohne Verwendung von MediaCodec.

Manifest-Konfiguration

Zur Unterstützung von PiP im Android-Manifest muss das Attribut android:supportsPictureInPicture für die Activity im Abschnitt angegeben werden. Ohne dieses Attribut erlaubt das System den PiP-Übergang nicht. Zusätzlich wird empfohlen, android:configChanges="screenSize|smallestScreenSize|screenLayout|orientation" anzugeben, damit die Activity bei Größenänderung des Fensters während des PiP-Übergangs nicht neu erstellt wird. Der Build muss targetSdkVersion >= 26 (Android 8.0) haben, damit das grundlegende PiP funktioniert.

In Android hat das PiP-Fenster standardmäßig keine Steuerelemente. Der Entwickler kann benutzerdefinierte Aktionen über RemoteAction in der Methode setPictureInPictureParams hinzufügen. Bis zu 3 Aktionen sind verfügbar (z. B. Pause/Play, Zurückspulen/Vorspulen, Schließen). Jede Aktion wird in der System-PiP-Überlagerung als Symbol angezeigt. Im Gegensatz zu iOS, wo alle UI-Elemente streng festgelegt sind, bietet Android mehr Flexibilität für grundlegende Steuerelemente.

Anpassung an verschiedene Versionen

PiP auf Android hat je nach Betriebssystemversion unterschiedliche Fähigkeiten. Auf Android 8.0–8.1 ist PiP nur für Video verfügbar, das über MediaPlayer oder MediaCodec mit SurfaceView abgespielt wird. Ab Android 9 kann PictureInPictureArgs.Builder verwendet werden, um das Seitenverhältnis des PiP-Fensters zu konfigurieren. Android 12 fügte PiP-Unterstützung für benutzerdefinierte SurfaceView und TextureView sowie verbesserte Übergänge zwischen Vollbild- und PiP-Modus hinzu. Android 13+ erlaubt die Anzeige des PiP-Fensters auch bei gesperrtem Bildschirm, wenn die App die entsprechende Berechtigung hat.

Ein Hauptunterschied von Android PiP zu iOS ist die Multi-PiP-Fähigkeit. Auf Android 12+ kann das System mehrere PiP-Fenster gleichzeitig anzeigen, wenn die Apps dies unterstützen und die Geräteleistung es erlaubt. In der Praxis ist Multi-PiP jedoch durch die SoC-Fähigkeiten begrenzt: Die meisten Geräte unterstützen aufgrund von Hardware-Decoder-Einschränkungen nur ein PiP-Fenster, da jedes PiP-Fenster seinen eigenen Videostream und eine separate Decodierungssitzung benötigt.

PiP-Codebeispiele

Sehen wir uns eine praktische Implementierung von PiP auf beiden mobilen Plattformen unter Berücksichtigung der letzten API-Änderungen an.

PiP auf iOS mit AVPictureInPictureController

import AVKit
import AVFoundation

class VideoPlayerViewController: UIViewController {
    var player: AVPlayer!
    var pipController: AVPictureInPictureController?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        let playerLayer = AVPlayerLayer(player: player)
        playerLayer.videoGravity = .resizeAspect
        view.layer.addSublayer(playerLayer)
        
        guard AVPictureInPictureController.isPictureInPictureSupported()
        else { return }
        
        pipController = AVPictureInPictureController(playerLayer: playerLayer)
        pipController?.delegate = self
    }
    
    @IBAction func startPiPTapped() {
        pipController?.startPictureInPicture()
    }
}

extension VideoPlayerViewController: AVPictureInPictureControllerDelegate {
    func pictureInPictureControllerWillStart(
        _ pictureInPictureController: AVPictureInPictureController
    ) {
        // UI-Elemente ausblenden, Speicher freigeben
    }
    
    func pictureInPictureControllerDidStop(
        _ pictureInPictureController: AVPictureInPictureController
    ) {
        // UI wiederherstellen, Rendering fortsetzen
    }
}

In diesem Beispiel wird AVPictureInPictureController mit playerLayer initialisiert, nachdem isPictureInPictureSupported überprüft wurde (PiP wird auf iPhone SE 1. Generation und einigen iPads ohne ausreichenden Speicher nicht unterstützt). Der Delegierte benachrichtigt die App über Start und Ende von PiP — in diesen Callbacks sollten UI-Elemente ausgeblendet und wiederhergestellt werden, da die App-Oberfläche im PiP-Modus nicht sichtbar ist. Beim Übergang zu PiP wird empfohlen, alle Animationen zu stoppen, Player-Steuerelemente auszublenden und ungenutzten Speicher freizugeben, um ein erzwungenes Entladen der App durch das System zu verhindern.

PiP auf Android mit PictureInPictureParams

class PipVideoActivity : AppCompatActivity() {
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setupVideoPlayer()
    }
    
    private fun enterPipMode() {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            val aspectRatio = Rational(16, 9)
            
            val pipParams = PictureInPictureParams.Builder()
                .setAspectRatio(aspectRatio)
                .setAutoEnterEnabled(true)
                .build()
            
            enterPictureInPictureMode(pipParams)
        }
    }
    
    override fun onPictureInPictureModeChanged(
        isInPictureInPictureMode: Boolean,
        newConfig: Configuration
    ) {
        if (isInPictureInPictureMode) {
            // UI ausblenden, nur auf Medien konzentrieren
            binding.controlsGroup.visibility = View.GONE
        } else {
            // UI wiederherstellen
            binding.controlsGroup.visibility = View.VISIBLE
        }
    }
}

Das Kotlin-Beispiel verwendet PictureInPictureParams.Builder zur Konfiguration von PiP. Die Methode setAspectRatio legt das Seitenverhältnis des PiP-Fensters fest (16:9 für typisches Video). setAutoEnterEnabled(true) aktiviert den automatischen PiP-Übergang beim Minimieren der App. Der Callback onPictureInPictureModeChanged wird beim Ein- und Austritt aus PiP aufgerufen — hier sollten UI-Elemente ausgeblendet oder angezeigt werden. Für Video auf SurfaceView ist eine zusätzliche Konfigurationsbehandlung erforderlich, indem android:configChanges="screenSize|smallestScreenSize" zum Manifest hinzugefügt wird, um die Neuerstellung der Activity während des PiP-Modus-Übergangs zu verhindern.

Wann man Picture-in-Picture verwendet

PiP ist ein leistungsstarkes Werkzeug zur Verbesserung der Benutzererfahrung in Apps, bei denen der Inhalt auch beim Wechsel zu anderen Aufgaben relevant bleibt. Die Implementierung von PiP sollte jedoch begründet sein und den Nutzer nicht ablenken.

Optimale Szenarien

Videoanrufe und Konferenzen sind eines der Hauptszenarien für PiP. In Zoom, FaceTime, Google Meet ermöglicht PiP dem Nutzer, den Gesprächspartner zu sehen, während er in anderen Apps arbeitet: Notizen lesen, eine Präsentation ansehen oder E-Mails überprüfen. PiP für Videoanrufe erfordert Hintergrundkamera-Unterstützung und eine korrekte Konfiguration der Audiositzung, um die Audioerfassung im Hintergrund fortzusetzen. Auf iOS wird dies mit AVSampleBufferDisplayLayer anstelle von AVPlayerLayer erreicht, da Videoanrufe AVPlayer nicht verwenden.

Streaming-Dienste (YouTube, Netflix, Twitch) nutzen PiP aktiv, um das Anschauen während der Suche nach neuen Inhalten fortzusetzen. YouTube Premium bietet PiP als kostenpflichtige Funktion, und Netflix schränkt PiP ebenfalls aufgrund von Inhaltslizenzbeschränkungen auf bestimmte Abonnementpläne ein. Zur Implementierung von PiP in einer Streaming-App ist die Integration mit einem DRM-System (FairPlay, Widevine) erforderlich, das eine sichere Pipeline im PiP-Modus unterstützt.

Wann PiP nicht benötigt wird

PiP ist nicht geeignet für Apps mit interaktiven Videoinhalten, die Benutzereingaben erfordern: Bildungsplattformen mit Tests im Player, Game-Streams mit Chat, Shopping-Apps mit Produktlinks im Video. In diesen Fällen ist das PiP-Fenster zu klein, um zusätzliche Informationen anzuzeigen, und interaktive Elemente werden innerhalb von PiP nicht unterstützt. Es wird empfohlen, PiP nur für die passive Ansicht zu verwenden, wenn keine Interaktion mit dem Inhalt erforderlich ist.

Für Musik- und Podcast-Apps ist PiP überflüssig — Hintergrundaudio ohne visuelles Fenster ist ausreichend. PiP verbraucht zusätzliche GPU-Ressourcen für das Rendern von Videos in einem schwebenden Fenster, was die Akkulaufzeit verkürzt. Wenn der Inhalt audio-basiert ist (Musik, Podcasts, Hörbücher) — verwenden Sie Hintergrundwiedergabe ohne PiP. Wenn er visuell ist — implementieren Sie PiP zur Verbesserung der Benutzererfahrung.