Texteingabefelder

Ein Texteingabefeld speichert einen String als Wert und einen String als Text. Der Wert ist immer ein gültiger String, während der Text ein beliebiger String sein kann, der in den Editor eingegeben wurde.

Texteingabefeld

Ein Block mit dem Label „Texteingabe:“ und einem Texteingabefeld, das auf „Standardtext“ festgelegt ist.

Texteingabefeld mit geöffnetem Editor

Derselbe Block, in dem das Feld bearbeitet wird.

Texteingabefeld in einem minimierten Block

Derselbe Block nach dem Minimieren. Es hat das Label „Texteingabe: Standardtext“ und einen gezackten rechten Rand, um anzuzeigen, dass es minimiert ist.

Erstellung

JSON

{
  "type": "example_textinput",
  "message0": "text input: %1",
  "args0": [
    {
      "type": "field_input",
      "name": "FIELDNAME",
      "text": "default text",
      "spellcheck": false
    }
  ]
}

JavaScript

Blockly.Blocks['example_textinput'] = {
  init: function() {
    this.appendDummyInput()
        .appendField("text input:")
        .appendField(new Blockly.FieldTextInput('default text'),
            'FIELDNAME');
  }
};

Der Konstruktor für die Texteingabe akzeptiert einen optionalen Wert und einen optionalen Validator. Der Wert sollte in einen String umgewandelt werden. Wenn er null oder undefined ist, wird ein leerer String verwendet.

Mit der JSON-Definition können Sie auch die Rechtschreibprüfung festlegen.

Serialisierung und XML

JSON

Das JSON für ein Texteingabefeld sieht so aus:

{
  "fields": {
    "FIELDNAME": "text"
  }
}

Dabei ist FIELDNAME ein String, der auf ein Texteingabefeld verweist, und der Wert ist der Wert, der auf das Feld angewendet werden soll. Für den Wert gelten dieselben Regeln wie für den Konstruktorwert.

XML

Das XML für ein Texteingabefeld sieht so aus:

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

Dabei enthält das Attribut name des Felds einen String, der auf ein Texteingabefeld verweist, und der innere Text ist der Wert, der auf das Feld angewendet werden soll. Für den Wert des inneren Texts gelten dieselben Regeln wie für den Konstruktorwert.

Anpassung

Rechtschreibprüfung

Mit der setSpellcheck Funktion können Sie festlegen, ob die Rechtschreibprüfung für den eingegebenen Text im Feld ausgeführt werden soll.

Texteingabefelder mit und ohne Rechtschreibprüfung

Ein animiertes GIF mit zwei Blöcken mit Texteingabefeldern. Im ersten Block ist die Rechtschreibprüfung aktiviert und falsch geschriebene Wörter werden mit einer roten Wellenlinie unterstrichen. Im zweiten Block ist die Rechtschreibprüfung deaktiviert und falsch geschriebene Wörter werden nicht unterstrichen.

Die Rechtschreibprüfung ist standardmäßig aktiviert.

Dies gilt für einzelne Felder. Wenn Sie alle Felder ändern möchten, ändern Sie die Eigenschaft Blockly.FieldTextInput.prototype.spellcheck_.

Validator für die Texteingabe erstellen

Der Wert eines Texteingabefelds ist ein String. Daher müssen alle Validatoren einen String akzeptieren und einen String, null oder undefined zurückgeben.

Hier ist ein Beispiel für einen Validator, der alle a-Zeichen aus dem String entfernt:

function(newValue) {
  return newValue.replace(/a/g, '');
}

Ein animiertes GIF, das zeigt, wie ein Texteingabefeld validiert wird. Wenn der Nutzer „bbbaaa“ eingibt und dann auf eine andere Stelle klickt, wird das Feld in „bbb“ geändert.