יש להחליק כדי לסגור

אפשר להחליק כדי לסגור האנימציה מציגה את המעבר כשהמשתמשים עוברים לדף הקודם.

פרטי האנימציה שרוצים לסגור באמצעות ההחלקה דומים לאלה של לחיצה על RSB. שלך האצבע שולטת בהתקדמות האנימציה עד ל-50%.

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

הטמעה

ל-Wear יש גרסה משלו של Box, SwipeToDismissBox. התכונה הזו מוסיפה תמיכה בתנועת החלקה לסגירה, שדומה לזו האחורית בנייד.

SwipeToDismissBox הוא תוכן קומפוזבילי שאפשר לסגור בהחלקה ימינה.

כדי להשתמש ב-SwipeToDismissBox, קודם צריך ליצור מדינה. המדינה מכילה מידע על כיוון ההחלקה, האם פועלת אנימציה, ערך היעד ועוד. הדוגמה הבאה מראה איך לעצב החלקה פשוטה לביטול הפעולה:

val state = rememberSwipeToDismissBoxState()
SwipeToDismissBox(
    onDismissed = { /* navigateBack */ },
) { isBackground ->
    if (isBackground) {
        Box(modifier = Modifier.fillMaxSize().background(MaterialTheme.colors.secondaryVariant))
    } else {
        Column(
            modifier = Modifier.fillMaxSize().background(MaterialTheme.colors.primary),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.Center,
        ) {
            Text("Swipe to dismiss", color = MaterialTheme.colors.onPrimary)
        }
    }
}

למידע נוסף על השימוש ב-scockToDismissBox בשילוב עם בספריית הניווט, אפשר לעיין במסמכי העזר עבור ספריית הניווט של Wear Compose.

עיצוב

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

קצה המסך

חשוב להביא בחשבון רכיבים אחרים בממשק המשתמש שהם ניתנים להחלקה, כמו תצוגות של אפליקציות בחלוקה לדפים. אם אפשר להחליק כדי לסגור את התצוגה, יש לשמור 20% מקצה המסך ל- שיפעיל את התנועה הזו.

אפשר לראות את הדוגמה הזו מחומר הכתיבה ל-codebase של Wear OS דוגמה להחלקה מהשוליים כאשר ניתן לגלול את התוכן באופן אופקי.

הסף לחזרה לתצוגת האפליקציה או להישארות בתצוגת האפליקציה

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

אם התנועה מהירה, מתעלמים מכלל הסף של 50% ומחליקים חזרה.