blockly > FocusManager

Lớp FocusManager

Một singleton trên mỗi trang quản lý tiêu điểm Blockly trên một hoặc nhiều IFocusableTree và đồng bộ hoá tiêu điểm này với DOM theo cả hai hướng.

Những người gọi muốn thay đổi tiêu điểm đầu vào một cách rõ ràng cho các thành phần Blockly đã chọn trên trang nên sử dụng các hàm tiêu điểm trong trình quản lý này.

Trình quản lý chịu trách nhiệm xử lý các sự kiện lấy tiêu điểm từ DOM (có thể phát sinh khi người dùng nhấp vào các phần tử trên trang) và đảm bảo rằng các IFocusableNode tương ứng được đánh dấu rõ ràng là được làm nổi bật chủ động/thụ động theo cách mà điều này sẽ được biểu thị bằng các lệnh gọi đến focusNode().

Chữ ký:

export declare class FocusManager 

Hàm khởi tạo

Hàm dựng Đối tượng sửa đổi Mô tả
(constructor)(addGlobalEventListener) Tạo một thực thể mới của lớp FocusManager

Thuộc tính

Thuộc tính Đối tượng sửa đổi Loại Mô tả
ACTIVE_FOCUS_NODE_CSS_CLASS_NAME

static

readonly

(không khai báo)

Lớp CSS được chỉ định cho các phần tử IFocusableNode hiện có DOM đang hoạt động và tiêu điểm Blockly.

Bạn không bao giờ được sử dụng trực tiếp. Thay vào đó, hãy dựa vào FocusManager để đảm bảo các nút có tiêu điểm đang hoạt động (tự động thông qua tiêu điểm DOM hoặc theo cách thủ công thông qua nhiều phương thức focus* do lớp này cung cấp).

Bạn cũng không nên truy vấn bằng tên lớp này. Thay vào đó, hãy sử dụng các phương thức FocusableTreeTraverser hoặc IFocusableTree để tìm một nút cụ thể.

PASSIVE_FOCUS_NODE_CSS_CLASS_NAME

static

readonly

(không khai báo)

Lớp CSS được chỉ định cho các phần tử IFocusableNode hiện có tiêu điểm thụ động (tức là chúng là nút gần đây nhất trong cây tương đối có tiêu điểm chủ động – xem ACTIVE_FOCUS_NODE_CSS_CLASS_NAME – và sẽ nhận lại tiêu điểm chủ động nếu cây xung quanh được yêu cầu trở thành tiêu điểm, tức là sử dụng focusTree bên dưới).

Hãy xem ACTIVE_FOCUS_NODE_CSS_CLASS_NAME để biết những lưu ý và hạn chế khi sử dụng trực tiếp hằng số này (thường thì bạn không bao giờ cần sử dụng hằng số này).

Phương thức

Phương thức Đối tượng sửa đổi Mô tả
ephemeralFocusTaken()
focusNode(focusableNode)

Tập trung đầu vào DOM vào nút được chỉ định và đánh dấu nút đó là đang được tập trung.

Mọi nút được lấy tiêu điểm trước đó sẽ được cập nhật thành nút được làm nổi bật một cách thụ động (nếu nút đó nằm trong một cây có thể lấy tiêu điểm khác) hoặc bị làm mờ (nếu nút đó nằm trong cùng một cây).

**Quan trọng**: Nếu nút được cung cấp không thể lấy tiêu điểm (ví dụ: phương thức canBeFocused() của nút trả về giá trị false), thì nút đó sẽ bị bỏ qua và mọi trạng thái tiêu điểm hiện có sẽ không thay đổi.

Xin lưu ý rằng thao tác này có thể cập nhật tabindex của phần tử trong nút được chỉ định để đảm bảo rằng trình đọc màn hình có thể đọc chính xác phần tử đó khi được lấy tiêu điểm.

focusTree(focusableTree)

Tập trung vào IFocusableTree cụ thể. Điều này có nghĩa là khôi phục tiêu điểm hoạt động cho nút được lấy tiêu điểm thụ động của cây hoặc lấy tiêu điểm cho nút gốc của cây.

Xin lưu ý rằng nếu cây được chỉ định đã có một nút được lấy tiêu điểm, thì điều này sẽ không làm thay đổi tiêu điểm hiện có (trừ phi nút đó có tiêu điểm thụ động, thì tiêu điểm đó sẽ được khôi phục thành tiêu điểm chủ động).

Hãy xem getFocusedNode để biết thông tin chi tiết về cách các nút khác bị ảnh hưởng.

getFocusedNode()

Trả về IFocusableNode hiện tại có tiêu điểm (luôn được liên kết với một IFocusableTree có tiêu điểm) hoặc giá trị rỗng nếu không có.

Xin lưu ý rằng hàm này sẽ duy trì tính chẵn lẻ với IFocusableTree.getFocusedNode(). Tức là nếu một cây có tiêu điểm nhưng không có phần tử con không phải gốc nào có tiêu điểm, thì hàm này sẽ trả về giá trị rỗng nhưng getFocusedTree() sẽ không trả về giá trị rỗng.

Ngoài ra, lưu ý rằng nếu tiêu điểm tạm thời hiện đang được ghi lại (ví dụ: bằng cách sử dụng takeEphemeralFocus), thì nút được trả về ở đây có thể hiện không có tiêu điểm DOM.

getFocusedTree()

Trả về IFocusableTree hiện tại có tiêu điểm hoặc giá trị rỗng nếu không có cây nào hiện có tiêu điểm.

Cũng lưu ý rằng nếu tiêu điểm tạm thời hiện đang được ghi lại (ví dụ: bằng cách sử dụng takeEphemeralFocus), thì cây được trả về ở đây có thể hiện không có tiêu điểm DOM.

getFocusManager() static

Trả về FocusManager trên toàn trang.

Phiên bản được trả về chắc chắn sẽ không thay đổi trong các lệnh gọi hàm, nhưng có thể thay đổi trong các lần tải trang.

isRegistered(tree) Trả về liệu cây được chỉ định đã được đăng ký trong trình quản lý này bằng registerTree và chưa được huỷ đăng ký bằng unregisterTree hay chưa.
registerTree(tree, rootShouldBeAutoTabbable)

Đăng ký một IFocusableTree mới để quản lý tiêu điểm tự động.

Nếu cây hiện có một phần tử có tiêu điểm DOM, thì phần tử đó sẽ không ảnh hưởng đến trạng thái nội bộ trong trình quản lý này cho đến khi tiêu điểm thay đổi thành một phần tử/nút mới hiện đang được theo dõi.

Hàm này sẽ báo lỗi nếu cây được cung cấp hiện đã được đăng ký trong trình quản lý này. Sử dụng isRegistered để kiểm tra trong trường hợp không chắc chắn liệu cây đã được đăng ký hay chưa.

Bạn có thể tuỳ chỉnh chế độ đăng ký của cây để định cấu hình các điểm dừng phím tab tự động. Cụ thể, điều này cung cấp khả năng cho người dùng có thể dùng phím Tab để chuyển đến gốc của cây nhưng chỉ khi cây không giữ tiêu điểm đang hoạt động. Nếu chức năng này bị vô hiệu hoá, thì gốc của cây sẽ tự động được đặt thành có thể lấy tiêu điểm (nhưng không thể nhấn phím tab) khi được lấy tiêu điểm lần đầu theo cách tương tự như mọi nút có thể lấy tiêu điểm khác.

takeEphemeralFocus(focusableElement)

Tạm thời nắm bắt tiêu điểm cho một phần tử cụ thể cho đến khi hàm lambda được trả về được gọi. Điều này được kỳ vọng sẽ đặc biệt hữu ích cho các luồng giao diện người dùng tạm thời như hộp thoại.

LƯU Ý QUAN TRỌNG: bạn *phải* gọi lambda được trả về, nếu không, tính năng tự động lấy tiêu điểm sẽ không hoạt động ở bất kỳ vị trí nào trên trang. Bạn nên liên kết lệnh gọi lambda với thao tác đóng giao diện người dùng tương ứng để nếu người dùng thay đổi dữ liệu đầu vào theo cách thủ công thành một phần tử bên ngoài giao diện người dùng tạm thời, thì giao diện người dùng sẽ đóng và dữ liệu đầu vào tự động được khôi phục. Xin lưu ý rằng hàm lambda này phải được gọi chính xác một lần và các lệnh gọi tiếp theo sẽ gây ra lỗi.

Xin lưu ý rằng trình quản lý sẽ tiếp tục theo dõi các tín hiệu đầu vào DOM ngay cả khi tiêu điểm tạm thời đang hoạt động, nhưng trình quản lý sẽ không thực sự thay đổi trạng thái nút cho đến khi hàm lambda được trả về được gọi. Ngoài ra, tại một thời điểm nhất định, bạn chỉ có thể kích hoạt 1 bối cảnh tiêu điểm tạm thời (nếu cố gắng kích hoạt nhiều bối cảnh cùng lúc, hệ thống sẽ báo lỗi).

unregisterTree(tree)

Huỷ đăng ký một IFocusableTree khỏi tính năng quản lý tiêu điểm tự động.

Nếu cây có một nút được lấy tiêu điểm trước đó, thì nút đó sẽ bị xoá điểm đánh dấu. Hàm này KHÔNG thay đổi tiêu điểm DOM.

Hàm này sẽ báo lỗi nếu cây được cung cấp hiện chưa được đăng ký trong trình quản lý này.

Hàm này sẽ đặt lại chỉ mục thẻ của phần tử gốc trong cây nếu cây được đăng ký bằng tính năng quản lý thẻ tự động.