כל רכיבי ה-Glimmer של Jetpack Compose מיועדים לפעול עם שיטות קלט רגילות, כמו הקשה או החלקה על לוח המגע של המשקפיים, וגם לקבל פקודות קלט ברמה נמוכה יותר שספציפיות לחומרה של משקפי התצוגה. רכיבי Glimmer של Jetpack Compose מטפלים אוטומטית באירועי הקלט הנדרשים.
כדי לבצע פעולות רגילות כמו גלילה וגרירה, כדאי להשתמש ברכיבי Glimmer של Jetpack Compose כדי להבטיח חוויה עקבית. עם זאת, כדי ליצור רכיבים מותאמים אישית או התנהגויות אינטראקציה בהתאמה אישית, אפשר להשתמש בממשקי API קיימים של Compose כמו Modifier.draggable או Modifier.scrollable.
קלט ומיקוד של מצביע העכבר
במשקפיים עם תצוגה, קלט של מצביע יכול להשפיע על המיקוד:
- הקשה: אינטראקציה ישירה להפעלת אלמנט. המיקוד עובר לרכיב כשמשתמש מבצע איתו אינטראקציה.
- החלקה: משמשת לניווט ולגלילה. מחוות החלקה שלא מטופלות מתורגמות אוטומטית לתנועות של המיקוד, וכך מאפשרות ניווט חלק בממשק המשתמש בלי קלט ישיר של מצביע.
התנהגות וסדר הניווט
התמקדות בתנועה ובשינוי הסדר בזמן שהמשתמש עובר בין מסכים באפליקציה.
הזזת המיקוד
בקונטיינר עם אפשרות גלילה, המיקוד עובר ברציפות עם החלקה בלוח המגע. ברכיבים נפרדים כמו שורה של לחצנים, כל החלקה מעבירה את המיקוד מרכיב אחד לרכיב הבא.
סדר המיקוד
בדומה ל-Jetpack Compose, Jetpack Compose Glimmer משתמש בחיפוש מיקוד חד-ממדי. מידע נוסף על סדר מעבר המיקוד זמין במאמר שינוי סדר מעבר המיקוד.
כדי לשנות את הפריט שמוגדר כברירת מחדל למיקוד, אפשר להוסיף Modifier.focusGroup() ברמה העליונה ולציין onEnter מותאם אישית: focusProperty
Modifier.focusProperties {
onEnter = {
initialFocus.requestFocus()
// Prevent focus from exiting the group
cancelFocusChange()
}
}
.focusGroup()
קונטיינרים של גלילה
כדי להבטיח חוויית משתמש אופטימלית, רכיבים עם אפשרות גלילה כמו רשימות צריכים להיות הרכיב העיקרי היחיד במסך. כדי למנוע בלבול בניווט ולקדם תנועת מיקוד חלקה וצפויה, מומלץ לא להציב רשימה שאפשר לגלול בה ישירות מעל או מתחת לרכיבים אינטראקטיביים אחרים, כמו כפתורים.
מצבי התמקדות שמוגדרים כברירת מחדל
Jetpack Compose Glimmer מטמיע מצבי מיקוד שמוגדרים כברירת מחדל בכל הרכיבים האינטראקטיביים שלו, כולל משטחים, כרטיסים ופריטים ברשימה, כדי לספק משוב חזותי עקבי וברור במהלך האינטראקציה של המשתמש.
ברירת מחדל: צבע הרקע של הלחצן נגזר מ-
GlimmerTheme.colors.surface, והתוכן הראשי שלו מחשב את צבע התוכן של אותו משטח.במיקוד: רוחב הגבול גדל כדי להראות שהאלמנט נמצא במיקוד.
התמקדות + לחיצה: הרקע מוגדר ל-
GlimmerTheme.colors.surfaceעם אטימות מוגברת כדי לציין את מצב הבחירה.