Was ist eine Blockdefinition?

Eine Blockdefinition ist ein Objekt, das einen benutzerdefinierten Block definiert. Damit wird beispielsweise das Erscheinungsbild des Blocks (Text, Felder, Verbindungen, Farbe usw.) sowie sein Verhalten (Block-Ereignishandler usw.) definiert.

Beispiel:

Ein Block vom Typ „string_length“.

kann in JSON oder JavaScript so definiert werden:

JSON

Blockly.common.defineBlocksWithJsonArray([{
  "type": "string_length",
  "message0": 'length of %1',
  "args0": [
    {
      "type": "input_value",
      "name": "VALUE",
      "check": "String"
    }
  ],
  "output": "Number",
  "colour": 160,
  "tooltip": "Returns number of letters in the provided text.",
  "helpUrl": "http://www.w3schools.com/jsref/jsref_length_string.asp"
}]);

Mit defineBlocksWithJsonArray wird eine Blockdefinition aus einem JSON-Objekt erstellt.

JavaScript

Blockly.Blocks['string_length'] = {
   init: function() {
     this.appendValueInput('VALUE')
         .setCheck('String')
         .appendField('length of');
     this.setOutput(true, 'Number');
     this.setColour(160);
     this.setTooltip('Returns number of letters in the provided text.');
     this.setHelpUrl('http://www.w3schools.com/jsref/jsref_length_string.asp');
   }
};

Wenn Sie JavaScript verwenden, erstellen Sie die Blockdefinition direkt.

Funktionsweise von Blockdefinitionen

Eine Blockdefinition ist ein Mixin, das Eigenschaften mit Funktionswerten enthält. Wenn ein neuer Block instanziiert wird, werden diese Eigenschaften in das neu erstellte Blockobjekt kopiert. Blockly ruft diese Funktionen auf, um benutzerdefiniertes Verhalten zu aktivieren.

Da die Definitionsfunktionen in das Blockobjekt gemischt werden:

  • Das Schlüsselwort this in Definitionsfunktionen bezieht sich auf das Blockobjekt. Das bedeutet, dass damit auf die öffentlichen Methoden und Attribute in der Klasse Block (oder BlockSvg) zugegriffen werden kann.

Blockly definiert eine kleine Anzahl von Funktionen, mit denen Sie Blöcke anpassen können. Die häufigste davon ist init. Sie wird von Blockly aufgerufen, um einen Block zu initialisieren und das Erscheinungsbild des Blocks zu definieren. Eine vollständige Liste finden Sie in den funktionswertigen Attributen der Klassen Block und BlockSvg. Diese Eigenschaften bilden im Grunde eine Schnittstelle für Blockdefinitionen, die implementiert werden muss. Alle sind optional.

Blockdefinitionen können auch benutzerdefinierte Funktionen haben, die jedoch nicht direkt von Blockly aufgerufen werden. Stattdessen können sie zur Implementierung anderer Funktionen verwendet werden. Ein Ereignishandler auf Blockebene (die Block.onchange-Eigenschaft) könnte beispielsweise verschiedene Ereignisse an verschiedene benutzerdefinierte Funktionen delegieren.

Blockdefinitionen erstellen

Es gibt verschiedene Möglichkeiten, Blockdefinitionen zu erstellen:

  • Mit den Blockly-Entwicklertools können Sie das Erscheinungsbild Ihres Blocks definieren. Kopieren Sie den generierten JSON- oder JavaScript-Code in Ihren Code und fügen Sie bei Bedarf benutzerdefinierten Code hinzu. Weitere Informationen finden Sie unter Blockly-Entwicklertools.
  • Suchen Sie nach einem ähnlichen Block, kopieren Sie seine Definition und passen Sie sie nach Bedarf an. Weitere Informationen finden Sie unter Vorhandene Definitionen ändern.
  • Blockdefinition manuell schreiben Weitere Informationen finden Sie unter JSON und JavaScript.