核取方塊欄位

核取方塊欄位會將字串儲存為值，並將字串儲存為文字。值為 'TRUE' 或 'FALSE'，文字為 'true' 或 'false'。

核取方塊欄位

標籤為「checkbox:」的方塊，以及含有勾號的核取方塊欄位。

收合區塊中的核取方塊欄位

收合後的相同區塊。標籤為「variable: true」，右側邊緣呈鋸齒狀，表示已摺疊。

創作

JSON

{
  "type": "example_checkbox",
  "message0": "checkbox: %1",
  "args0": [
    {
      "type": "field_checkbox",
      "name": "FIELDNAME",
      "checked": true
    }
  ]
}

JavaScript

Blockly.Blocks['example_checkbox'] = {
  init: function() {
    this.appendDummyInput()
        .appendField('checkbox:')
        .appendField(new Blockly.FieldCheckbox(true), 'FIELDNAME');
  }
};

核取方塊建構函式會接收選用值和選用驗證器。選用值應為 'TRUE'、'FALSE' 或布林值，否則會預設為 false。

序列化

JSON

核取方塊欄位的 JSON 如下所示：

{
  "fields": {
    "FIELDNAME": true
  }
}

其中 FIELDNAME 是參照核取方塊欄位的字串，而值是要套用至欄位的值。此值必須是布林值。

XML

核取方塊欄位的 XML 如下所示：

<field name="FIELDNAME">TRUE</field>

或

<field name="FIELDNAME">true</field>

其中 name 屬性包含參照核取方塊欄位的字串，而內部文字則是要套用至欄位的值。內文值遵循與建構函式值相同的規則。

請注意，在經過還原序列化和重新序列化後，所有內部文字值都會變成大寫 ('TRUE' 或 'FALSE')。這在比較工作區時有時很重要。

自訂

勾號字元

Blockly.FieldCheckbox.CHECK_CHAR 屬性可用於變更勾號的外觀。此值應為包含 Unicode 字元的字串。

核取方塊欄位，以愛心取代勾號

CHECK_CHAR 屬性預設為 \u2713 或勾號 (✓)。

這是全域屬性，因此設定後會修改所有核取方塊欄位。

建立核取方塊驗證器

核取方塊欄位的值為 'TRUE' 或 'FALSE'，因此驗證工具應接受這些值 (即字串)，並傳回 'TRUE'、'FALSE'、null 或 undefined。

以下是驗證器範例，可根據核取方塊是否已勾選，隱藏或顯示文字輸入欄位：

  validate: function(newValue) {
    var sourceBlock = this.getSourceBlock();
    sourceBlock.showTextField_ = newValue == 'TRUE';
    sourceBlock.updateTextField();

    return newValue;
  },

  updateTextField: function() {
    var input = this.getInput('DUMMY');
    if (this.showTextField_ && !this.getField('TEXT')) {
      input.appendField(new Blockly.FieldTextInput(), 'TEXT');
    } else if (!this.showTextField_ && this.getField('TEXT')) {
      input.removeField('TEXT');
    }
  }

含有驗證器的核取方塊欄位

GIF 動畫：顯示核取方塊已勾選。勾選核取方塊後，系統會顯示文字欄位。