Поля изображения

Поле изображения хранит строку в качестве своего значения и строку в качестве своего текста. Его значение — это src изображения, а его текст — это alt-строка, описывающая/представляющая изображение.

Поле изображения

Поле изображения на свернутом блоке

Создание

JSON

{
  "type": "example_image",
  "message0": "image: %1",
  "args0": [
    {
      "type": "field_image",
      "src": "https://www.gstatic.com/codesite/ph/images/star_on.gif",
      "width": 15,
      "height": 15,
      "alt": "*"
    }
  ]
}

JavaScript

Blockly.Blocks['example_image'] = {
  init: function() {
    this.appendDummyInput()
      .appendField("image:")
      .appendField(new Blockly.FieldImage(
        "https://www.gstatic.com/codesite/ph/images/star_on.gif",
        15,
        15,
        "*"));
  }
};

Конструктор изображений принимает:

Параметр	Описание
src	Строка, указывающая на файл растрового изображения .
width	Необходимо привести к ненулевому числу.
height	Необходимо привести к ненулевому числу.
opt_alt	(Необязательно) Строка, которая точно описывает/представляет изображение. Используется вместо изображения, когда блок сворачивается. Если она null или undefined будет использована пустая строка.
opt_onClick	(Необязательно) Функция, вызываемая при щелчке по полю.
opt_flipRtl	(Необязательно) Логическое значение. Если true , изображение переворачивается по вертикальной оси в режиме справа налево. По умолчанию false . Полезно для значков «поворот налево» и «поворот направо».

Сериализация

Поля изображений не сериализуются.

Обработчик щелчков

Примечание: Для получения общей информации о валидаторах см. Валидаторы .

Поле изображения не принимает валидатор; вместо этого оно явно принимает функцию, которая вызывается при каждом щелчке по полю. Это означает, что изображения могут действовать как кнопки, которые существуют на блоках.

Обработчик щелчка можно установить в конструкторе JavaScript или с помощью функции setOnClickHandler .

Вот пример обработчика щелчка, который сворачивает блок при вызове.

function() {
    this.getSourceBlock().setCollapsed(true);
}