Boutons et libellés

Vous pouvez placer un bouton ou un libellé partout où vous pouvez placer un bloc dans la boîte à outils.

JSON

{
  "kind": "flyoutToolbox",
  "contents": [
    {
      "kind": "block",
      "type":"logic_operation"
    },
    {
      "kind": "label",
      "text": "A label",
      "web-class": "myLabelStyle"
    },
    {
      "kind": "label",
      "text": "Another label"
    },
    {
      "kind": "block",
      "type": "logic_negate"
    },
    {
      "kind": "button",
      "text": "A button",
      "callbackKey": "myFirstButtonPressed"
    },
    {
      "kind": "block",
      "type": "logic_boolean"
    }
  ]
}

XML

<xml id="toolbox" style="display: none">
  <block type="logic_operation"></block>
  <label text="A label" web-class="myLabelStyle"></label>
  <label text="Another label"></label>
  <block type="logic_negate"></block>
  <button text="A button" callbackKey="myFirstButtonPressed"></button>
  <block type="logic_boolean"></block>
</xml>

    <style>
    .myLabelStyle>.blocklyFlyoutLabelText {
      font-style: italic;
      fill: green;
    }
    </style>

Vous pouvez spécifier un nom de classe CSS à appliquer à votre bouton ou à votre libellé. Dans l'exemple ci-dessus, le premier libellé utilise un style personnalisé, tandis que le second utilise le style par défaut.

Les boutons doivent comporter des fonctions de rappel, mais pas les libellés. Pour définir le rappel pour un clic de bouton donné, utilisez

yourWorkspace.registerButtonCallback(yourCallbackKey, yourFunction).

Votre fonction doit accepter le bouton sur lequel l'utilisateur a cliqué comme argument. Le bouton "Créer une variable" de la catégorie "Variable" est un bon exemple de bouton avec rappel.