Définir des composants de base personnalisés

Les blocs sont ce que vous utilisez pour programmer. Ils représentent des expressions et des instructions dans des langages de programmation basés sur du texte.

Pour en savoir plus sur les blocs et leurs composants, consultez le glossaire visuel.

Définition du bloc

Une définition de bloc spécifie les connexions et les champs de la pièce de puzzle de votre bloc. L'apparence et le style de vos blocs sont principalement spécifiés par d'autres moyens. La chaîne (généralement du code) dans laquelle votre bloc est converti est définie comme un générateur de code de bloc.

Le moyen le plus simple de définir des blocs simples consiste à utiliser le format JSON.

Cet extrait de code définit un bloc "avancer" avec des connexions "suivant" et "précédent", ainsi qu'un champ pour la distance.

// Create the definition.
const definitions = Blockly.common.createBlockDefinitionsFromJsonArray([
  {
    // The type is like the "class name" for your block. It is used to construct
    // new instances. E.g. in the toolbox.
    type: 'my_custom_block',
    // The message defines the basic text of your block, and where inputs or
    // fields will be inserted.
    message0: 'move forward %1',
    args0: [
      // Each arg is associated with a %# in the message.
      // This one gets substituted for %1.
      {
        // The type specifies the kind of input or field to be inserted.
        type: 'field_number',
        // The name allows you to reference the field and get its value.
        name: 'FIELD_NAME',
      }
    ],
    // Adds an untyped previous connection to the top of the block.
    previousStatement: null,
    // Adds an untyped next connection to the bottom of the block.
    nextStatement: null,
  }
]);

// Register the definition.
Blockly.common.defineBlocks(definitions);

Pour en savoir plus sur la définition de vos blocs et leur ajout à votre boîte à outils, consultez la section Présentation des blocs personnalisés.