本指南著重介紹如何使用目前在 Blockly 中實作的預設鍵盤導覽功能。
使用鍵盤瀏覽功能
使用者必須能夠完成下列工作,才能使用鍵盤瀏覽功能:
- 在工作區中移動
- 工作區連線區塊
- 將區塊新增至工作區
- 卸離區塊
- 瀏覽工具箱
- 瀏覽飛機
- 從飛出點插入方塊
以下將說明 Blockly 的預設鍵盤導覽如何完成這些工作。
啟用鍵盤導覽功能
使用者可以按下 Shift + Ctrl + k 鍵,啟用及停用鍵盤導覽功能。首次啟用鍵盤瀏覽功能時,工作區會出現閃爍的紅線。此為遊標。並在使用者瀏覽工作區時顯示使用者目前的位置和更新。
按下 Enter 鍵,會在目前位置建立代表使用者的標記的藍線。標記會顯示可供封鎖插入的目標位置。不會隨著您移動工作區在工作區周圍移動。
使用預設遊標
工作區由輸入、欄位、連線、區塊和工作區座標組成。預設遊標會將所有元件分割成不同層級,藉此在工作區四處移動。
如要瀏覽不同層級,請使用 A 和 D 鍵。如要瀏覽不同層級項目,請使用「W」和「S」鍵。
工作區層級
按下 Shift + Ctrl + K 鍵即可進入鍵盤導覽模式。即可將遊標放在工作區或工作區的第一個區塊。如果遊標位於區塊上,請按兩次 A 以移至工作區層級。如要移動工作區的遊標,請使用 Shift + WASD 鍵。如要移至堆疊層級,請使用 D 鍵。
堆疊層級
在堆疊層級,您可以使用 W 和 S 鍵在工作區的區塊堆疊之間瀏覽。在這個層級,遊標在堆疊中所有區塊周圍的實心紅色矩形代表。如要前往所選堆疊中的第一個區塊,請使用 D 鍵。
封鎖與連線等級
這個層級會保留區塊以及區塊中的所有外部連線。如果有先前的連線或輸出連線,預設遊標會設為略過區塊。如果兩者不存在,遊標會移至區塊,如下所示。
以下是三個可能的外部連線。
在區塊和連線層級,您可以使用「W」和「S」鍵瀏覽外部連線。在這個層級中,遊標會以目前連線的紅色外框閃爍。如要前往第一個欄位或區塊上的輸入內容,請按下 D 鍵。
欄位和輸入層級
此層級會保留該區塊中的所有欄位和輸入內容。欄位和輸入的呈現形式如下所示。
在這個層級,您可以使用 W 和 S,瀏覽目前區塊的可編輯欄位和輸入項目。對欄位的遊標是實心的紅色矩形。遊標是閃爍的紅色拼圖,對輸入項目而言。遊標位於輸入來源時,按下 D 即可移至已連結的區塊。
當遊標位於欄位上時,按下 Enter 鍵即可編輯。
連結工作模塊
- 使用 WASD 鍵前往目標連線
- 使用 Enter 鍵標示連線
- 使用 WASD 鍵前往有效的連接點
- 使用 I 鍵連接兩個區塊 (用於插入)
移動工作區上的區塊
通常在 Blockly 中,您只要選取區塊,然後將其拖曳至所需位置並放開,即可將區塊移到工作區。使用鍵盤快速鍵標示目標位置後,前往您要移動的區塊,然後指示它移動。
- 使用 Shift + WASD 鍵前往工作區的位置
- 使用 Enter 鍵在工作區上標示該位置
- 使用 WASD 鍵前往要移動的區塊
- 使用 I 鍵將方塊移至標示的位置
卸除塊
通常在 Blockly 中,您可以選取偏差區塊並將其從父項區塊拖曳,藉此中斷兩個區塊的連線。使用鍵盤快速鍵時,只要在要中斷連線的連線上按下 X 即可中斷連線。
- 使用 WASD 鍵前往要中斷的連線
- 中斷與 X 的連線
從 Toolbox 插入區塊
- 按下 T 鍵開啟工具箱
- 使用 W 和 S 鍵瀏覽類別
- 按下 D 鍵可移至延伸畫面的方塊
- 使用 W 和 S 鍵瀏覽方塊
- 按下 Enter 鍵,從彈簧插入一個區塊
實驗
我們認為使用者可能會想嘗試四大領域:
- 按鍵對應:哪些按鍵對應動作應對應至哪些動作。
- 螢幕閱讀器/記錄/警告文字:螢幕閱讀器應如何讀出遊標位置,以及任何錯誤或警告。
- 工作區導覽:使用者如何瀏覽工作區中不同區塊、欄位、輸入內容和連線。
- 遊標外觀:遊標和標記的外觀。
如要進一步瞭解如何使用這些 API,請參閱 Blockly 鍵盤導覽程式碼研究室。
如果您想嘗試進行其他測試,但希望有助於解決問題,請填寫表單。
常見問題
問:為什麼你未使用方向鍵瀏覽鍵盤?
答:螢幕閱讀器通常會使用方向鍵。我們不想幹擾此問題,因此選用 WASD 鍵。
,但我們瞭解每個人都有不同的需求,因此強烈建議您建立簡單的方式,輕鬆變更鍵對應。
問:這似乎有點複雜,為什麼我們需要不同層?
答:考量鍵盤瀏覽方式時,我們需要一種結構化的方式,才能在不同的區塊、連線、欄位、輸入內容和工作區座標之間移動。
內部我們以抽象語法樹狀結構 (AST) 表示這個情況。預設的遊標實作作業不會離這個模型太遠。這可讓開發人員深入瞭解基礎架構。還有其他cursors讓使用者更容易瞭解。
限制
我們目前不支援導覽至非封鎖的元件 (例如垃圾桶、縮放按鈕和飛出按鈕)。如要進一步瞭解相關限制,請參閱開啟的鍵盤瀏覽bugs清單。