Pola tekstowe

Pole wprowadzania tekstu przechowuje ciąg znaków jako wartość i ciąg znaków jako tekst. Jego wartość jest zawsze prawidłowym ciągiem znaków, a tekst może być dowolnym ciągiem znaków wpisanym w edytorze.

Pole wprowadzania tekstu

Blok z etykietą „text input:” (wprowadzanie tekstu) i polem wprowadzania tekstu ustawionym na „default text” (domyślny tekst).

Pole wprowadzania tekstu z otwartym edytorem

Ten sam blok z edytowanym polem.

Pole wprowadzania tekstu w zwiniętym bloku

Ten sam blok po zwinięciu. Ma etykietę „text input: default text” i nierówną prawą krawędź, co oznacza, że jest zwinięte.

na podstawie trendów

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');
  }
};

Konstruktor pola tekstowego przyjmuje opcjonalną wartość i opcjonalny walidator. Wartość powinna być przekształcana w ciąg znaków. Jeśli jest to null lub undefined, używany będzie pusty ciąg znaków.

Definicja JSON umożliwia też ustawienie opcji spellcheck.

Serializacja i XML

JSON

Kod JSON pola wprowadzania tekstu wygląda tak:

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

gdzie FIELDNAME to ciąg znaków odwołujący się do pola wprowadzania tekstu, a wartość to wartość, którą należy zastosować w polu. Wartość jest zgodna z tymi samymi regułami co wartość konstruktora.

XML

Kod XML pola do wprowadzania tekstu wygląda tak:

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

Gdy atrybut name pola zawiera ciąg znaków odwołujący się do pola tekstowego, a tekst wewnętrzny jest wartością, którą należy zastosować do pola. Wartość tekstu wewnętrznego podlega tym samym regułom co wartość konstruktora.

Dostosowywanie

sprawdzanie pisowni,

Funkcja setSpellcheck może służyć do określania, czy pole ma sprawdzać pisownię wpisywanego tekstu.

Pola wprowadzania tekstu ze sprawdzaniem pisowni i bez niego

Animowany GIF przedstawiający 2 bloki z polami wpisywania tekstu. W pierwszym bloku sprawdzanie pisowni jest włączone, a błędnie napisane słowa są podkreślone czerwoną falistą linią. W drugim bloku sprawdzanie pisowni jest wyłączone, a błędy nie są podkreślane.

Sprawdzanie pisowni jest domyślnie włączone.

Dotyczy to poszczególnych pól. Jeśli chcesz zmodyfikować wszystkie pola, zmień właściwość Blockly.FieldTextInput.prototype.spellcheck_.

Tworzenie narzędzia do sprawdzania poprawności danych wprowadzanych w polu tekstowym

Wartość pola tekstowego jest ciągiem znaków, więc wszystkie walidatory muszą akceptować ciąg znaków i zwracać ciąg znaków, null lub undefined.

Oto przykład walidatora, który usuwa wszystkie znaki a z ciągu znaków:

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

Animowany GIF pokazujący sprawdzanie poprawności pola do wpisywania tekstu. Gdy użytkownik wpisze „bbbaaa” i kliknie w innym miejscu, pole zmieni się na „bbb”.