ช่องรูปภาพ

ช่องรูปภาพจะเก็บสตริงเป็นค่า และสตริงเป็นข้อความ ค่าของรูปภาพคือ 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	ต้องแคสต์ไปยังจำนวนที่ไม่ใช่ 0
height	ต้องแคสต์ไปยังจำนวนที่ไม่ใช่ 0
opt_alt	(ไม่บังคับ) สตริงที่อธิบาย/นำเสนอรูปภาพได้อย่างถูกต้อง หากเป็น null หรือ undefined ระบบจะใช้สตริงว่าง
opt_onClick	(ไม่บังคับ) ฟังก์ชันที่จะเรียกใช้เมื่อมีการคลิกฟิลด์
opt_flipRtl	(ไม่บังคับ) บูลีน หากเป็น true รูปภาพจะพลิกผ่านแกนแนวตั้งเมื่ออยู่ในโหมดขวาไปซ้าย ค่าเริ่มต้นคือ false มีประโยชน์สำหรับไอคอน "เลี้ยวซ้าย" และ "เลี้ยวขวา"

การทำให้เป็นอนุกรม

ช่องรูปภาพทำให้เป็นอนุกรมไม่ได้

เครื่องจัดการคลิก

หมายเหตุ: โปรดดูข้อมูลเกี่ยวกับโปรแกรมตรวจสอบโดยทั่วไปที่ผู้ตรวจสอบ

ช่องรูปภาพไม่ยอมรับเครื่องมือตรวจสอบ แต่จะยอมรับฟังก์ชันที่เรียกเมื่อมีการคลิกช่องอย่างชัดแจ้ง ซึ่งหมายความว่ารูปภาพอาจทำหน้าที่เหมือนปุ่มที่อยู่บนบล็อก

คุณสามารถตั้งค่าเครื่องจัดการการคลิกในเครื่องมือสร้าง JavaScript หรือใช้ฟังก์ชัน setOnClickHandler

นี่คือตัวอย่างของเครื่องจัดการแบบคลิกที่ยุบบล็อกเมื่อมีการเรียกใช้

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