如要擴充現有欄位,您必須將內建欄位的子類別 (例如
FieldTextInput
、FieldColour
),然後根據自身需求修改部分內容。
以下列舉幾個可修改的欄位:
如果您要建立
自訂欄位
任何內建欄位皆不需要行為,應將 Field
設為子類別。
常見擴充功能
大多數的自訂欄位會擴充以下三種類型的其中一種:
- 文字輸入:如果您希望使用者能夠在欄位中輸入文字,建議您擴充
FieldTextInput
。 - 數字:如要儲存數字,請擴充
FieldNumber
。 - 下拉式選單:如要建立下拉式選單,但想儲存其他模式,
非預設字串或圖片模型,您必須擴充
FieldDropdown
。- 注意:擴充
FieldDropdown
之前,請先檢查下拉式選單欄位的 不過,自訂選項不符合您的需求。
- 注意:擴充
在某些情況下,您可能會想要擴充不同的欄位類型。適用對象
範例 FieldLabelSerializable
擴充 FieldLabel
。
子類別
import * as Blockly from 'blockly';
export class MyCustomTextField extends Blockly.FieldTextInput {
constructor(value, validator, config) {
super(value, validator, config);
}
}
欄位子類別的建構函式看起來與 建構函式的建構函式十分相似 自訂欄位。子建構函式的簽名 通常會與超建構函式的簽名相符。
JSON 與登錄
您也應該註冊欄位一次:
Blockly.fieldRegistry.register('my_custom_text_field', MyCustomTextField);
並在類別中提供 fromJson
實作,以便與其搭配運作
JSON 格式:
static fromJson(options) {
const value = Blockly.utils.parsing.replaceMessageReferences(options.value);
return new MySubclassName(value);
}
如要進一步瞭解如何註冊欄位,請參閱 JSON 和註冊 部分。