區塊的形狀是由算繪器根據區塊的定義 (即欄位和連線) 決定。
內建算繪器
Blockly 提供三種內建的算繪器,每種都會為程式帶來略有不同的感覺。
轉譯器 | 說明 | 圖片 |
---|---|---|
Thrasos | 建議使用的轉譯器。這是更現代的 geras 算繪器,間距更平均,且有實線邊框。 | ![]() |
Geras | 預設的算繪器。這是 Blockly 最初使用的原始算繪器。 | ![]() |
Zelos | 以 Scratch 3.0 積木設計為基礎的轉譯器。 | ![]() |
如要使用其中一個算繪器,請將名稱傳遞至設定選項:
Blockly.inject('blocklyDiv', {
renderer: 'thrasos'
});
自訂算繪器
如果想讓程式呈現與內建算繪器不同的外觀和風格,也可以建立自訂算繪器。如要開始使用,Blockly 團隊建議您:
- 請詳閱算繪器概念文件,瞭解算繪器的所有元件如何搭配運作。
- 完成自訂轉譯器程式碼研究室,實際練習自訂轉譯。
- 將偵錯算繪器新增至專案。
- 自訂算繪器。