הגדרת 'חיזוי החזרה'

כדי להפעיל אנימציות של תנועת החזרה לחיזוי, צריך להביע הסכמה לתמיכה בתנועת החזרה לחיזוי. כדי להביע הסכמה, מוסיפים את הערך android:enableOnBackInvokedCallback="true" לתג <application> או לתגי <activity> נפרדים בקובץ AndroidManifest.xml.

הפעלת אנימציות מערכת שמוגדרות כברירת מחדל

אנימציות המערכת של חזרה למסך הבית, של תנועה בין פעילויות ושל תנועה בין משימות זמינות במכשירים עם Android מגרסה 15 ואילך, באפליקציות שהועברו לממשקי ה-API הנתמכים לטיפול בלחצן החזרה.

  • חזרה למסך הבית: החזרת המשתמש למסך הבית.
  • בין פעילויות: מעברים בין פעילויות בתוך האפליקציה.
  • בין משימות: מעברים בין משימות.

האנימציות האלה מופעלות כברירת מחדל ב-Android מגרסה 15 ואילך. במכשירים עם Android בגרסה 13 או 14, המשתמשים יכולים להפעיל אותם דרך האפשרויות למפתחים.

כדי להשתמש באנימציות המערכת, צריך לעדכן את יחסי התלות של AndroidX ב-Activity לגרסה 1.6.0 ואילך.

הפעלת חזרה חזוי באמצעות 'ניווט בכתב'

כדי להשתמש בתכונה 'חזרה חזותית' בתכונה 'ניווט בכתיבה', צריך לוודא שאתם משתמשים בספרייה navigation-compose בגרסה 2.8.0 ואילך.

כשמשתמשים מחליקים חזרה, מתבצע מעבר אוטומטי בין המסכים בתפריט הניווט:

איור 2. אנימציית ברירת המחדל של מעבר חלק בתוך האפליקציה ב-SociaLite.

כשמנווטים, אפשר ליצור מעברים מותאמים אישית באמצעות popEnterTransition ו-popExitTransition. כשמחילים את המשתנים האלה על NavHost, אפשר להגדיר את האנימציה של המסכים 'כניסה' ו'יציאה'. אפשר להשתמש בהם כדי ליצור מגוון אפקטים, כמו שינוי קנה מידה, העלמה או החלקה.

בדוגמה הזו, scaleOut משמש בתוך popExitTransition כדי להקטין את המסך היוצא בזמן שהמשתמש מנווט חזרה. בנוסף, הפרמטר transformOrigin קובע את הנקודה שסביבה מתרחשת האנימציה של השינוי בגודל. כברירת מחדל, זוהי נקודת המרכז של המסך (0.5f, 0.5f). אפשר לשנות את הערך הזה כדי שהשינוי בגודל יתבצע מנקודה אחרת.

NavHost(
    navController = navController,
    startDestination = Home,
    popExitTransition = {
        scaleOut(
            targetScale = 0.9f,
            transformOrigin = TransformOrigin(pivotFractionX = 0.5f, pivotFractionY = 0.5f)
        )
    },
    popEnterTransition = {
        EnterTransition.None
    },
    modifier = modifier,
)

הקוד הזה מניב את התוצאה הבאה:

איור 3. אנימציה בהתאמה אישית באפליקציה ב-SociaLite.

popEnterTransition ו-popExitTransition שולטים באנימציות באופן ספציפי כשפותחים את מקבץ האפליקציות הקודם, למשל באמצעות תנועה אחורה. אפשר גם להשתמש ב-enterTransition וב-exitTransition כדי להגדיר אנימציות לכניסה וליציאה מרכיבים מורכבים באופן כללי, ולא רק לחזור חזרה חזוי. אם מגדירים רק את enterTransition ו-exitTransition, הם משמשים גם לניווט רגיל וגם להוצאה של סטאק הקודמים. עם זאת, השימוש ב-popEnterTransition וב-popExitTransition מאפשר ליצור אנימציות נפרדות לניווט לאחור.

שילוב עם מעברים של רכיבים משותפים

מעברים בין רכיבים משותפים מספקים חיבור חזותי חלק בין רכיבים מורכבים עם תוכן משותף, ולרוב משמשים לניווט.

איור 4. מעבר לרכיב משותף עם חזרה חזויה ב'כתיבה' בתפריט הניווט.

במאמר חזרה חזותית חזרה עם רכיבים משותפים מוסבר איך להשתמש ברכיבים משותפים עם 'ניווט לכתיבה'.

תמיכה בחזרה חזותית חזוי באמצעות רכיבי Material Compose

רכיבים רבים בספריית Material Compose תוכננו לפעול בצורה חלקה עם תנועות חזרה חזויות. כדי להפעיל אנימציות חזרה חזויות ברכיבים האלה, צריך לכלול בפרויקט את התלות האחרונה ב-Material3 (androidx.compose.material3:material3-*:1.3.0 ואילך).

רכיבי Material שתומכים בחיזוי אנימציה של תנועת החזרה הם:

SearchBar ו-ModalBottomSheet מקבלים אנימציה אוטומטית באמצעות תנועות חיזוי של חזרה אחורה. כדי להשתמש ב-ModalNavigationDrawer, ב-ModalDrawerSheet, ב-DismissibleDrawerSheet וב-DismissibleNavigationDrawer, צריך להעביר את drawerState ל-composables של תוכן הגיליונות הרלוונטיים.

בדיקת האנימציה של חיזוי תנועת החזרה

אם אתם עדיין משתמשים ב-Android 13 או ב-Android 14, תוכלו לבדוק את האנימציה של החזרה למסך הבית.

כדי לבדוק את האנימציה הזו, מבצעים את השלבים הבאים:

  1. במכשיר, עוברים אל הגדרות > מערכת > אפשרויות למפתחים.
  2. בוחרים באפשרות אנימציה חזרה חזוי.
  3. פותחים את האפליקציה המעודכנת ומשתמשים בתנועת החזרה לאחור כדי לראות איך היא פועלת.

במכשירים עם Android מגרסה 15 ואילך, התכונה הזו מופעלת כברירת מחדל.

מקורות מידע נוספים