"نافذة ضمن النافذة" (PiP) هي نوع خاص من وضع النوافذ المتعدّدة يُستخدم في الغالب لتشغيل الفيديوهات. تتيح هذه الميزة للمستخدم مشاهدة فيديو في نافذة صغيرة مثبَّتة في إحدى زوايا الشاشة، بينما يتنقل بين التطبيقات الأخرى أو يتصفّح المحتوى على الشاشة الرئيسية.
تستفيد ميزة "نافذة ضمن النافذة" من واجهات برمجة التطبيقات المتعددة النوافذ المتاحة في الإصدار 7.0 من نظام التشغيل Android لتوفير نافذة تراكب الفيديو المثبّتة. لإضافة ميزة "نافذة ضمن النافذة" إلى تطبيقك، عليك تسجيل نشاطك، وتبديل النشاط إلى وضع "نافذة ضمن النافذة" حسب الحاجة، والتأكّد من إخفاء عناصر واجهة المستخدم واستمرار تشغيل الفيديو عندما يكون النشاط في وضع "نافذة ضمن النافذة".
使用 Jetpack 实现 PiP
使用 Jetpack 画中画库来实现画中画体验,因为它可以简化集成并减少常见的应用内问题。如需查看其使用示例,请参阅我们的平台示例应用。不过,如果您希望使用平台 API 实现 PiP,请参阅以下文档。
التعامل مع واجهة المستخدم في وضع "نافذة ضمن النافذة"
عند الدخول إلى وضع "نافذة داخل النافذة"، تنتقل واجهة المستخدم بالكامل إلى نافذة "نافذة داخل النافذة" ما لم تحدّد كيف يجب أن تبدو واجهة المستخدم في وضع "نافذة داخل النافذة" وخارجه.
أولاً، عليك معرفة ما إذا كان تطبيقك في وضع "نافذة ضمن النافذة" أم لا. يمكنك استخدام
OnPictureInPictureModeChangedProvider لتحقيق ذلك.
يوضّح لك الرمز أدناه ما إذا كان تطبيقك في وضع "نافذة ضمن النافذة".
@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 } }
يمكنك الآن استخدام rememberIsInPipMode() لتحديد عناصر واجهة المستخدم التي تريد عرضها
عندما ينتقل التطبيق إلى وضع "نافذة ضمن النافذة":
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() }