图片字段

图片字段存储字符串作为其值,存储字符串作为文本。其值是图片的 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 (可选)可准确描述/表示图片的字符串。如果是 nullundefined,将使用空字符串。
opt_onClick (可选)点击字段时调用的函数。
opt_flipRtl (可选)布尔值。如果为 true,则在从右到左模式下图片将沿纵轴翻转。默认值为 false。对于“左转”和“右转”图标很有用。

序列化

图片字段不可序列化。

点击处理程序

image 字段不接受验证程序,而是明确接受每次点击字段时都会调用的函数。也就是说,图片可以像块状一样运行。

您可以在 JavaScript 构造函数中设置点击处理程序,也可以使用 setOnClickHandler 函数进行设置。

以下是一个点击处理程序的示例,该处理程序会在调用时收起代码块。

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