Champs de cases à cocher

Un champ de case à cocher stocke une chaîne en tant que valeur et une chaîne en tant que texte. Son la valeur est 'TRUE' ou 'FALSE', et son texte est 'true' ou 'false'

Champ de case à cocher

Champ de case à cocher dans le bloc réduit

Création

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

Le constructeur de case à cocher utilise une valeur et un programme de validation. La valeur facultative doit être : 'TRUE', 'FALSE' ou une valeur booléenne. Sinon, la valeur par défaut est false.

Sérialisation

JSON

Le code JSON d'un champ de case à cocher se présente comme suit:

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

FIELDNAME est une chaîne faisant référence à un champ de case à cocher, et où la valeur est celle à appliquer au champ. La valeur doit être une valeur booléenne.

XML

Le code XML d'un champ de case à cocher se présente comme suit:

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

ou

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

Où l'attribut name contient une chaîne faisant référence à un champ de case à cocher, et le texte intérieur est la valeur à appliquer au champ. La valeur de texte interne suit les mêmes règles que la valeur du constructeur.

Notez qu'après la désérialisation et la resérialisation de tout le texte interne seront en majuscules ('TRUE' ou 'FALSE'). C'est parfois important lorsque les espaces de travail sont différents.

Personnalisation

Coche

Vous pouvez utiliser la propriété Blockly.FieldCheckbox.CHECK_CHAR pour modifier ressemble à une coche. La valeur doit être une chaîne contenant un Unicode .

Champ de case à cocher avec un cœur au lieu d&#39;une coche

La propriété CHECK_CHAR est définie par défaut sur "\u2713" ou ✓.

Comme il s'agit d'une propriété globale, tous les champs de case à cocher sont modifiés lorsqu'ils sont définis.

Créer un programme de validation de cases à cocher

La valeur d'un champ de case à cocher est 'TRUE' ou 'FALSE'. Un programme de validation accepter ces valeurs (c'est-à-dire une chaîne) et renvoyer 'TRUE', 'FALSE', null ou undefined

Voici un exemple de programme de validation qui masque ou affiche un champ de saisie en fonction si la case est cochée:

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

Champ de case à cocher avec un programme de validation