"תמונה בתוך תמונה" (PiP) הוא סוג מיוחד של מצב ריבוי חלונות שמשמש בעיקר להפעלת סרטונים. היא מאפשרת למשתמשים לצפות בסרטון בחלון קטן שמוצמד לפינה של המסך, בזמן שהם עוברים בין אפליקציות או גולשים בתוכן במסך הראשי.
התכונה "תמונה בתוך תמונה" משתמשת בממשקי ה-API של ריבוי חלונות שזמינים ב-Android 7.0 כדי לספק את החלון המוצמד של שכבת-העל של הסרטון. כדי להוסיף את התכונה "תמונה בתוך תמונה" לאפליקציה, צריך לרשום את הפעילות, להעביר את הפעילות למצב "תמונה בתוך תמונה" לפי הצורך, ולוודא שהרכיבים בממשק המשתמש מוסתרים ושהפעלת הסרטון נמשכת כשהפעילות במצב "תמונה בתוך תמונה".
הטמעה של תמונה בתוך תמונה באמצעות Jetpack
כדי להטמיע את התכונה 'תמונה בתוך תמונה' (PiP), מומלץ להשתמש בספריית Jetpack Picture-in-Picture. כך אפשר לייעל את ההטמעה ולצמצם בעיות נפוצות באפליקציה. אפשר לעיין באפליקציה לדוגמה של הפלטפורמה כדי לראות דוגמה לשימוש בה. אבל אם אתם מעדיפים להטמיע את התכונה 'תמונה בתוך תמונה' באמצעות ממשקי API של הפלטפורמה, תוכלו לעיין במאמרי העזרה הבאים.
איך לטפל בממשק המשתמש במצב PiP
כשנכנסים למצב "תמונה בתוך תמונה", כל ממשק המשתמש של האפליקציה נכנס לחלון "תמונה בתוך תמונה", אלא אם מציינים איך ממשק המשתמש צריך להיראות במצב "תמונה בתוך תמונה" ומחוץ לו.
קודם כול, אתם צריכים לדעת מתי האפליקציה שלכם נמצאת במצב PiP ומתי לא. כדי לעשות את זה, אפשר להשתמש ב-OnPictureInPictureModeChangedProvider.
הקוד הבא בודק אם האפליקציה נמצאת במצב 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 } }
עכשיו אפשר להשתמש ב-rememberIsInPipMode() כדי להחליף בין הרכיבים בממשק המשתמש שיוצגו כשהאפליקציה נכנסת למצב 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() }