Tentang picture-in-picture (PiP)

Picture-in-picture (PiP) adalah jenis khusus mode multi-aplikasi yang sebagian besar digunakan untuk pemutaran video. Dengan fitur ini, pengguna dapat menonton video di jendela kecil yang di-pin ke sudut layar sambil berpindah-pindah aplikasi atau menjelajahi konten di layar utama.

PiP memanfaatkan API multi-aplikasi yang tersedia di Android 7.0 untuk menyediakan jendela overlay video yang disematkan. Untuk menambahkan PiP ke aplikasi, Anda harus mendaftarkan aktivitas, mengalihkan aktivitas ke mode PiP sesuai kebutuhan, dan memastikan elemen UI disembunyikan dan pemutaran video berlanjut saat aktivitas berlangsung dalam mode PiP.

Menerapkan PiP dengan Jetpack

Gunakan library Picture-in-Picture Jetpack untuk menerapkan pengalaman picture-in-picture karena library ini menyederhanakan integrasi dan mengurangi masalah umum dalam aplikasi. Lihat aplikasi contoh platform kami untuk melihat contoh penggunaannya. Namun, jika Anda lebih suka menerapkan PiP menggunakan API platform, lihat dokumentasi berikut.

Menangani UI dalam mode PiP

Saat Anda memasuki mode PiP, seluruh UI aplikasi akan memasuki jendela PiP kecuali jika Anda menentukan tampilan UI di dalam dan di luar mode PiP.

Pertama, Anda harus mengetahui apakah aplikasi berada dalam mode PiP atau tidak. Anda dapat menggunakan OnPictureInPictureModeChangedProvider untuk melakukannya. Kode berikut memeriksa apakah aplikasi Anda berada dalam mode PiP.

@Composable
fun rememberIsInPipMode(): Boolean {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
        val activity = LocalContext.current.findActivity()
        var pipMode by remember { mutableStateOf(activity.isInPictureInPictureMode) }
        DisposableEffect(activity) {
            val observer = Consumer<PictureInPictureModeChangedInfo> { info ->
                pipMode = info.isInPictureInPictureMode
            }
            activity.addOnPictureInPictureModeChangedListener(
                observer
            )
            onDispose { activity.removeOnPictureInPictureModeChangedListener(observer) }
        }
        return pipMode
    } else {
        return false
    }
}
PictureInPictureSnippets.kt

Sekarang, Anda dapat menggunakan rememberIsInPipMode() untuk mengalihkan elemen UI yang akan ditampilkan saat aplikasi memasuki mode PiP:

val inPipMode = rememberIsInPipMode()

Column(modifier = modifier) {
    // This text will only show up when the app is not in PiP mode
    if (!inPipMode) {
        Text(
            text = "Picture in Picture",
        )
    }
    VideoPlayer()
}
PictureInPictureSnippets.kt