Kolom kotak centang

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

Kolom kotak centang

Kolom kotak centang pada blok yang diciutkan

yang Dipicu oleh Tren

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 menggunakan nilai opsional dan validator opsional. Nilai opsional harus berupa 'TRUE', 'FALSE', atau boolean. Jika tidak, nilai default akan ditetapkan ke false.

Serialisasi

JSON

JSON untuk kolom kotak centang terlihat seperti berikut:

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

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

XML

XML untuk bidang kotak centang terlihat seperti berikut:

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

atau

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

Dengan atribut name berisi string yang merujuk ke kolom kotak centang, dan teks bagian dalam adalah nilai yang akan diterapkan ke kolom tersebut. Nilai teks bagian dalam mengikuti aturan yang sama dengan nilai konstruktor.

Perlu diketahui bahwa setelah dideserialisasi dan diserialkan ulang, semua nilai teks bagian dalam akan ditulis dalam huruf kapital ('TRUE' atau 'FALSE'). Hal ini terkadang penting saat melakukan diffing ruang kerja.

Penyesuaian

Karakter tanda centang

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

Kolom kotak centang dengan ikon hati, bukan tanda centang

Properti CHECK_CHAR ditetapkan secara default 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 ini 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