תגובה להתמקדות

בכל פעם שהמיקוד משתנה בעץ הקומפוזיציה, Compose מפעיל אירוע מיקוד שמשתני הורה וצאצא יכולים לראות. אפשר להשתמש במשתנה onFocusChanged כדי להאזין למעברים בין מצבי מיקוד, לשלוח שאילתות לגבי מאפייני המיקוד הנוכחיים ולהפעיל עדכונים בממשק המשתמש שמונעים על ידי מצבים.

צפייה במצב המיקוד באמצעות onFocusChanged

המשתנה onFocusChanged מספק אובייקט FocusState בכל פעם שרכיב מקבל או מאבד את המיקוד.

לדוגמה, אפשר לעקוב אחרי שינויים במיקוד כדי לעדכן את המצב של רכיב בהתאמה אישית (כמו שינוי צבע הגבול של רכיב או הפעלת אנימציה):

var color by remember { mutableStateOf(Color.White) }
Card(
    modifier = Modifier
        .onFocusChanged {
            color = if (it.isFocused) Red else White
        }
        .border(5.dp, color)
) {}
FocusSnippets.kt

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

הערה: כדי לראות אינדיקציות סטנדרטיות של Material 3 למיקוד (כמו גלים או טבעות מיקוד), עיינו במאמר ציון מצב המיקוד.

מאפייני FocusState

האובייקט FocusState שמועבר אל onFocusChanged מספק שלושה מאפיינים עיקריים:

• isFocused: מחזירה את הערך true אם הפונקציה הקומפוזבילית הספציפית שאליה משויך ה-modifier הזה נמצאת כרגע במיקוד קלט פעיל.
• ‫hasFocus: מחזירה את הערך true אם הרכיב ה-composable הזה או אחד מהרכיבים ה-composable הצאצאים שלו נמצאים כרגע במיקוד. זה שימושי למכלים הורים (כמו כרטיסים או סרגלי כלים) שצריכים לדעת מתי אחד מהילדים שלהם פעיל.
• ‫isCaptured: הפונקציה מחזירה את הערך true אם המיקוד נעול כרגע על הרכיב (לדוגמה, במהלך אינטראקציות משנה מודאליות באמצעות captureFocus()). בזמן שהמיקוד נעול, ניסיון להעביר את המיקוד לרכיבים אחרים לא מבטל את המיקוד.

Modifier.onFocusChanged { focusState ->
    val isFocused = focusState.isFocused
    val hasFocus = focusState.hasFocus
    val isCaptured = focusState.isCaptured
}