Champs de cases à cocher

Un champ de case à cocher stocke une chaîne comme valeur et une chaîne comme texte. Sa valeur est 'TRUE' ou 'FALSE', et son texte est 'true' ou 'false'.

Champ de case à cocher

![Un bloc avec le libellé "case à cocher:" et un champ de case à cocher avec une coche.

Champ de case à cocher sur un 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 la case à cocher accepte une valeur facultative et un valideur facultatif. 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
  }
}

Où FIELDNAME est une chaîne faisant référence à un champ de case à cocher, et la valeur est la valeur à appliquer au champ. La valeur doit être 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>

Remarque :Il n'est pas nécessaire d'appliquer des guillemets au texte interne.

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

Notez qu'après avoir été désérialisé et sérialisé, toutes les valeurs de texte interne seront en majuscules ('TRUE' ou 'FALSE'). Cela est parfois important lors de la comparaison d'espaces de travail.

Personnalisation

Caractère coche

La propriété Blockly.FieldCheckbox.CHECK_CHAR permet de modifier l'apparence de la coche. La valeur doit être une chaîne contenant un caractère Unicode.

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

Il s'agit d'une propriété globale. Par conséquent, elle modifie tous les champs de case à cocher lorsqu'elle est définie.

Créer un validateur de case à cocher

Remarque :Pour en savoir plus sur les validateurs en général, consultez Validateurs.

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

Attention :La méthode getValueBoolean ne doit pas être utilisée dans les validateurs, car elle renvoie la valeur actuelle, et non la nouvelle.

Voici un exemple de valideur qui masque ou affiche un champ de saisie de texte en fonction de la case à cocher:

  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 validateur