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