blockly > FocusManager

Class FocusManager

Singleton per halaman yang mengelola fokus Blockly di satu atau beberapa IFocusableTree, dan menyinkronkan fokus ini secara dua arah dengan DOM.

Pemanggil yang ingin mengubah fokus input secara eksplisit untuk komponen Blockly tertentu di halaman harus menggunakan fungsi fokus di pengelola ini.

Pengelola bertanggung jawab untuk menangani peristiwa fokus dari DOM (yang mungkin muncul dari pengguna yang mengklik elemen halaman) dan memastikan bahwa IFocusableNode yang sesuai ditandai dengan jelas sebagai disorot secara aktif/pasif dengan cara yang sama seperti yang akan ditampilkan dengan panggilan ke focusNode().

Tanda Tangan:

export declare class FocusManager 

Konstruktor

Konstruktor Pengubah Deskripsi
(constructor)(addGlobalEventListener) Membuat instance baru class FocusManager

Properti

Properti Pengubah Jenis Deskripsi
ACTIVE_FOCUS_NODE_CSS_CLASS_NAME

static

readonly

(tidak dinyatakan)

Class CSS yang ditetapkan ke elemen IFocusableNode yang saat ini memiliki fokus DOM dan Blockly yang aktif.

Metode ini tidak boleh digunakan secara langsung. Sebagai gantinya, andalkan FocusManager untuk memastikan node memiliki fokus aktif (baik secara otomatis melalui fokus DOM atau secara manual melalui berbagai metode focus* yang disediakan oleh class ini).

Sebaiknya jangan kueri menggunakan nama class ini juga. Sebagai gantinya, gunakan metode FocusableTreeTraverser atau IFocusableTree untuk menemukan node tertentu.

PASSIVE_FOCUS_NODE_CSS_CLASS_NAME

static

readonly

(tidak dinyatakan)

Class CSS yang ditetapkan ke elemen IFocusableNode yang saat ini memiliki fokus pasif (yaitu, elemen tersebut adalah node terbaru dalam hierarki relatifnya yang memiliki fokus aktif--lihat ACTIVE_FOCUS_NODE_CSS_CLASS_NAME--dan akan menerima fokus aktif lagi jika hierarki di sekitarnya diminta untuk menjadi fokus, yaitu menggunakan focusTree di bawah).

Lihat ACTIVE_FOCUS_NODE_CSS_CLASS_NAME untuk mengetahui peringatan dan batasan terkait penggunaan konstanta ini secara langsung (umumnya tidak perlu digunakan).

Metode

Metode Pengubah Deskripsi
ephemeralFocusTaken()
focusNode(focusableNode)

Memfokuskan input DOM pada node yang ditentukan, dan menandainya sebagai fokus aktif.

Semua node yang sebelumnya difokuskan akan diperbarui agar disorot secara pasif (jika berada di hierarki yang dapat difokuskan yang berbeda) atau dikaburkan (jika berada di hierarki yang sama).

**Penting**: Jika node yang diberikan tidak dapat difokuskan (misalnya, metode canBeFocused() menampilkan nilai salah (false)), node tersebut akan diabaikan dan status fokus yang ada akan tetap tidak berubah.

Perhatikan bahwa hal ini dapat memperbarui tabindex elemen node yang ditentukan untuk memastikan bahwa elemen tersebut dapat dibacakan dengan benar oleh pembaca layar saat difokuskan.

focusTree(focusableTree)

Memfokuskan IFocusableTree tertentu. Hal ini berarti memulihkan fokus aktif ke node yang difokuskan secara pasif di hierarki, atau memfokuskan node root hierarki.

Perhatikan bahwa jika pohon yang ditentukan sudah memiliki node yang difokuskan, maka hal ini tidak akan mengubah fokus yang ada (kecuali jika node tersebut memiliki fokus pasif, maka fokus akan dipulihkan ke fokus aktif).

Lihat getFocusedNode untuk mengetahui detail tentang pengaruhnya terhadap node lain.

getFocusedNode()

Menampilkan IFocusableNode saat ini dengan fokus (yang selalu terikat ke IFocusableTree yang difokuskan), atau null jika tidak ada.

Perhatikan bahwa fungsi ini akan mempertahankan paritas dengan IFocusableTree.getFocusedNode(). Artinya, jika pohon itu sendiri memiliki fokus, tetapi tidak ada turunan non-root-nya yang memiliki fokus, fungsi ini akan menampilkan null, tetapi getFocusedTree() tidak.

Perhatikan juga bahwa jika fokus sementara saat ini diambil (misalnya, menggunakan takeEphemeralFocus), node yang ditampilkan di sini mungkin saat ini tidak memiliki fokus DOM.

getFocusedTree()

Menampilkan IFocusableTree saat ini yang memiliki fokus, atau null jika saat ini tidak ada.

Perhatikan juga bahwa jika fokus sementara saat ini diambil (misalnya, menggunakan takeEphemeralFocus), maka hierarki yang ditampilkan di sini mungkin saat ini tidak memiliki fokus DOM.

getFocusManager() static

Menampilkan FocusManager global halaman.

Instance yang ditampilkan dijamin tidak akan berubah di seluruh panggilan fungsi, tetapi dapat berubah di seluruh pemuatan halaman.

isRegistered(tree) Menampilkan apakah pohon yang ditentukan telah terdaftar di pengelola ini menggunakan registerTree dan belum dibatalkan pendaftarannya menggunakan unregisterTree.
registerTree(tree, rootShouldBeAutoTabbable)

Mendaftarkan IFocusableTree baru untuk pengelolaan fokus otomatis.

Jika saat ini hierarki memiliki elemen dengan fokus DOM, hal ini tidak akan memengaruhi status internal di pengelola ini hingga fokus berubah ke elemen/node baru yang kini dipantau.

Fungsi ini akan menampilkan error jika pohon yang diberikan saat ini sudah terdaftar di pengelola ini. Gunakan isRegistered untuk memeriksa dalam kasus ketika tidak dapat dipastikan apakah pohon telah didaftarkan.

Pendaftaran pohon dapat disesuaikan untuk mengonfigurasi tab otomatis. Hal ini secara khusus memberikan kemampuan bagi pengguna untuk dapat menavigasi tab ke root hierarki, tetapi hanya saat hierarki tidak memiliki fokus aktif. Jika fungsi ini dinonaktifkan, root hierarki akan otomatis dapat difokuskan (tetapi tidak dapat di-tab) saat pertama kali difokuskan dengan cara yang sama seperti node lain yang dapat difokuskan.

takeEphemeralFocus(focusableElement)

Menangkap fokus secara sementara untuk elemen tertentu hingga lambda yang ditampilkan dipanggil. Hal ini diharapkan sangat berguna untuk alur UI sementara seperti dialog.

PENTING: lambda yang ditampilkan *harus* dipanggil, jika tidak, fokus otomatis tidak akan lagi berfungsi di mana pun di halaman. Sangat disarankan untuk mengikat panggilan lambda ke penutupan UI yang sesuai sehingga jika input diubah secara manual ke elemen di luar UI sementara, UI akan ditutup dan input otomatis dipulihkan. Perhatikan bahwa lambda ini harus dipanggil tepat satu kali dan panggilan berikutnya akan memunculkan error.

Perhatikan bahwa pengelola akan terus melacak sinyal input DOM meskipun fokus sementara aktif, tetapi tidak akan benar-benar mengubah status node hingga lambda yang ditampilkan dipanggil. Selain itu, hanya 1 konteks fokus sementara yang dapat aktif pada waktu tertentu (mencoba mengaktifkan lebih dari satu secara bersamaan akan menyebabkan error).

unregisterTree(tree)

Membatalkan pendaftaran IFocusableTree dari pengelolaan fokus otomatis.

Jika pohon memiliki node yang sebelumnya difokuskan, sorotannya akan dihapus. Fungsi ini TIDAK mengubah fokus DOM.

Fungsi ini akan menampilkan pengecualian jika pohon yang diberikan saat ini tidak terdaftar di pengelola ini.

Fungsi ini akan mereset tabindex elemen root pohon jika pohon didaftarkan dengan pengelolaan tab otomatis.