Kolom kotak centang

Kolom kotak centang menyimpan string sebagai nilainya, dan string sebagai teksnya. Nilainya adalah 'TRUE' atau 'FALSE', dan teksnya adalah 'true' atau 'false'.

Kolom kotak centang

Blok dengan label "checkbox:" dan kolom kotak centang dengan tanda centang.

Kolom kotak centang pada blok yang diciutkan

Blok yang sama setelah diciutkan. Bagian ini memiliki label "variable: true" dan tepi kanan yang bergerigi untuk menunjukkan bahwa bagian ini diciutkan.

Alat

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');
  }
};

Konstruktor kotak centang mengambil nilai opsional dan validator opsional. Nilai opsional harus berupa 'TRUE', 'FALSE', atau boolean, jika tidak, nilai defaultnya adalah false.

Serialisasi

JSON

JSON untuk kolom kotak centang terlihat seperti ini:

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

Dengan FIELDNAME adalah string yang mereferensikan kolom kotak centang, dan nilai adalah nilai yang akan diterapkan ke kolom. Nilai harus berupa boolean.

XML

XML untuk kolom kotak centang terlihat seperti berikut:

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

atau

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

Jika atribut name berisi string yang mereferensikan kolom kotak centang, dan teks dalamnya adalah nilai yang akan diterapkan ke kolom. Nilai teks dalam mengikuti aturan yang sama dengan nilai konstruktor.

Perhatikan bahwa setelah dideserialisasi dan diserialisasi ulang, semua nilai teks dalam akan menggunakan huruf kapital ('TRUE' atau 'FALSE'). Hal ini terkadang penting saat membandingkan ruang kerja.

Penyesuaian

Karakter tanda centang

Properti Blockly.FieldCheckbox.CHECK_CHAR dapat digunakan untuk mengubah tampilan tanda centang. Nilai harus berupa string yang berisi karakter Unicode.

Kolom kotak centang dengan hati, bukan tanda centang

Properti CHECK_CHAR secara default ditetapkan ke \u2713 atau ✓.

Ini adalah properti global, sehingga akan mengubah semua kolom kotak centang saat disetel.

Membuat validator kotak centang

Nilai kolom kotak centang adalah 'TRUE' atau 'FALSE' sehingga validator harus menerima nilai tersebut (yaitu string) dan menampilkan 'TRUE', 'FALSE', null, atau undefined.

Berikut contoh validator yang menyembunyikan atau menampilkan kolom input teks berdasarkan apakah kotak centang dicentang:

  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');
    }
  }

Kolom kotak centang dengan validator

GIF animasi yang menampilkan kotak centang yang dicentang. Jika kotak centang dicentang, kolom teks akan ditampilkan.