המחלקות FocusManager
סינגלטון לכל דף שמנהל את המיקוד של Blockly בכמה רכיבי IFocusableTree, ומסנכרן את המיקוד הזה עם ה-DOM באופן דו-כיווני.
מתקשרים שרוצים לשנות באופן מפורש את מיקוד הקלט עבור רכיבי Blockly נבחרים בדף צריכים להשתמש בפונקציות המיקוד במנהל הזה.
האחריות של המנהל היא לטפל באירועי מיקוד מ-DOM (שעשויים לנבוע מלחיצה של משתמשים על רכיבי דף) ולוודא שצמתים תואמים של IFocusableNode מסומנים בבירור כהדגשה פעילה או פסיבית, באותו אופן שבו זה היה מיוצג באמצעות קריאות ל-focusNode().
Signature:
export declare class FocusManager
יצרנים
יצרן | גורמי שינוי | תיאור |
---|---|---|
(constructor)(addGlobalEventListener) | יוצר מופע חדש של המחלקה FocusManager |
מאפיינים
נכס | גורמי שינוי | סוג | תיאור |
---|---|---|---|
ACTIVE_FOCUS_NODE_CSS_CLASS_NAME |
|
(לא הוגדר) | מחלקת ה-CSS שמוקצית לרכיבי IFocusableNode שיש להם כרגע DOM פעיל ופוקוס ב-Blockly. אסור להשתמש בערך הזה ישירות. במקום זאת, כדאי להסתמך על FocusManager כדי לוודא שלצמתים יש מיקוד פעיל (באופן אוטומטי דרך מיקוד DOM או באופן ידני דרך שיטות המיקוד השונות שמופיעות במחלקה הזו). מומלץ גם לא להשתמש בשם המחלקה הזו בשאילתות. במקום זאת, משתמשים בשיטות של FocusableTreeTraverser או של IFocusableTree כדי למצוא צומת ספציפי. |
PASSIVE_FOCUS_NODE_CSS_CLASS_NAME |
|
(לא הוגדר) | מחלקת ה-CSS שמוקצית לרכיבי IFocusableNode שיש להם כרגע מיקוד פסיבי (כלומר, הם היו הצומת האחרון בעץ היחסי שלהם שהיה לו מיקוד פעיל – ראו ACTIVE_FOCUS_NODE_CSS_CLASS_NAME – והם יקבלו שוב מיקוד פעיל אם תתבצע בקשה להעברת המיקוד לעץ שמקיף אותם, כלומר באמצעות focusTree בהמשך). במאמר ACTIVE_FOCUS_NODE_CSS_CLASS_NAME מפורטות אזהרות ומגבלות לגבי שימוש ישיר בקבוע הזה (בדרך כלל אין צורך להשתמש בו). |
Methods
שיטה | גורמי שינוי | תיאור |
---|---|---|
ephemeralFocusTaken() | ||
focusNode(focusableNode) | הפונקציה מעבירה את המיקוד של קלט DOM לצומת שצוין, ומסמנת אותו כצומת שמתבצעת בו התמקדות פעילה. כל צומת שהיה ממוקד קודם יעודכן כך שיוצג בהדגשה פסיבית (אם הוא נמצא בעץ אחר שאפשר להתמקד בו) או בטשטוש (אם הוא נמצא באותו עץ). **חשוב**: אם לא ניתן להתמקד בצומת שצוין (למשל, אם השיטה canBeFocused() מחזירה false), המערכת תתעלם ממנו וכל מצב מיקוד קיים יישאר ללא שינוי. הערה: יכול להיות שהפעולה הזו תעדכן את מאפיין ה-tabindex של רכיב הצומת שצוין, כדי לוודא שקוראי מסך יוכלו לקרוא אותו בצורה תקינה כשהוא מודגש. |
|
focusTree(focusableTree) | הפונקציה מתמקדת ב-IFocusableTree ספציפי. המשמעות היא להחזיר את המיקוד הפעיל לצומת של העץ שמוגדר כמיקוד פסיבי, או למקד את צומת הבסיס של העץ. שימו לב שאם כבר יש צומת מודגש בעץ שצוין, הפעולה הזו לא תשנה את ההדגשה הקיימת (אלא אם ההדגשה של הצומת היא פסיבית, ואז היא תשוחזר להדגשה פעילה). פרטים על ההשפעה על צמתים אחרים מופיעים במאמר בנושא getFocusedNode. |
|
getFocusedNode() | הפונקציה מחזירה את IFocusableNode הנוכחי עם המיקוד (שתמיד קשור ל-IFocusableTree עם המיקוד), או null אם אין כזה. הערה: הפונקציה הזו תפעל באופן זהה ל-IFocusableTree.getFocusedNode(). כלומר, אם העץ עצמו נמצא במוקד אבל אף אחד מהצאצאים שלו שאינם שורש לא נמצא במוקד, הפונקציה הזו תחזיר null אבל הפונקציה getFocusedTree() לא תחזיר null. שימו לב גם שאם הפוקוס הזמני נלכד כרגע (למשל באמצעות takeEphemeralFocus), יכול להיות שהצומת שמוחזר כאן לא נמצא כרגע בפוקוס של DOM. |
|
getFocusedTree() | הפונקציה מחזירה את העץ הנוכחי של IFocusableTree שיש לו מיקוד, או null אם אין כזה. שימו לב גם שאם הפוקוס הזמני נלכד כרגע (למשל באמצעות takeEphemeralFocus), יכול להיות שלעץ שמוחזר כאן אין כרגע פוקוס DOM. |
|
getFocusManager() | static |
מחזירה את FocusManager הגלובלי של הדף. המופע שמוחזר לא ישתנה בין קריאות לפונקציה, אבל הוא עשוי להשתנות בין טעינות של הדף. |
isRegistered(tree) | הפונקציה מחזירה ערך בוליאני שקובע אם העץ שצוין כבר נרשם במנהל הזה באמצעות registerTree, ועדיין לא בוטל הרישום שלו באמצעות unregisterTree. | |
registerTree(tree, rootShouldBeAutoTabbable) | רושם IFocusableTree חדש לניהול פוקוס אוטומטי. אם לעץ יש כרגע רכיב עם מיקוד DOM, זה לא ישפיע על המצב הפנימי במנהל הזה עד שהמיקוד ישתנה לרכיב או לצומת חדשים שנמצאים כעת במעקב. הפונקציה הזו יוצרת חריגה אם העץ שסופק כבר רשום כרגע בחשבון הניהול הזה. אפשר להשתמש ב-isRegistered כדי לבדוק במקרים שבהם לא בטוח אם העץ נרשם. אפשר להתאים אישית את הרישום של העץ כדי להגדיר עצירות טאב אוטומטיות. התכונה הזו מאפשרת למשתמשים לנווט באמצעות מקש Tab לשורש העץ, אבל רק אם העץ לא נמצא במוקד הפעיל. אם הפונקציונליות הזו מושבתת, שורש העץ יהפוך אוטומטית לניתן להתמקדות (אבל לא לניתן להעברה באמצעות Tab) כשהוא יקבל את המיקוד בפעם הראשונה, בדיוק כמו כל צומת אחר שניתן להתמקדות. |
|
takeEphemeralFocus(focusableElement) | הפונקציה מתמקדת באופן זמני ברכיב ספציפי עד לקריאה ללמדה שהוחזרה. האפשרות הזו שימושית במיוחד לרכיבי ממשק משתמש זמניים, כמו תיבות דו-שיח. חשוב: צריך לקרוא ללמדה שהוחזרה, אחרת המיקוד האוטומטי לא יפעל יותר בשום מקום בדף. מומלץ מאוד לקשור את הקריאה ל-Lambda לסגירה של ממשק המשתמש התואם, כך שאם הקלט ישתנה ידנית לרכיב מחוץ לממשק המשתמש הזמני, ממשק המשתמש ייסגר והקלט האוטומטי ישוחזר. שימו לב שחובה לקרוא ל-lambda הזה בדיוק פעם אחת, וקריאות חוזרות יגרמו לשגיאה. חשוב לציין שמנהל התגים ימשיך לעקוב אחרי אותות קלט של DOM גם כשהמיקוד הזמני פעיל, אבל הוא לא ישנה את מצב הצומת עד שהפונקציה למדא שמוחזרת תיקרא. בנוסף, רק הקשר זמני אחד של פוקוס יכול להיות פעיל בכל רגע נתון (ניסיון להפעיל יותר מאחד בו-זמנית יגרום להצגת שגיאה). |
|
unregisterTree(tree) | הפונקציה מבטלת את הרישום של IFocusableTree מניהול המיקוד האוטומטי. אם לעץ היה צומת ממוקד קודם, ההדגשה שלו תוסר. הפונקציה הזו לא משנה את המיקוד ב-DOM. הפונקציה הזו יוצרת חריגה אם העץ שצוין לא רשום כרגע בחשבון הניהול הזה. הפונקציה הזו תאפס את tabindex של רכיב הבסיס בעץ אם העץ נרשם עם ניהול אוטומטי של מקשי Tab. |