ขยายช่องที่มีอยู่

ในการขยายช่องที่มีอยู่ คุณต้องจัดประเภทย่อยช่องข้อมูลที่มีอยู่แล้ว (เช่น FieldTextInput, FieldColour) แล้วแก้ไขบางส่วนให้เหมาะกับความต้องการของคุณ บางส่วนของช่องที่แก้ไขได้ ได้แก่

หากต้องการสร้าง ช่องที่กำหนดเอง ที่ไม่ต้องการลักษณะการทำงานจากช่องในตัว คุณควรคลาสย่อย Field

ส่วนขยายทั่วไป

ช่องที่กำหนดเองส่วนใหญ่จะขยายหนึ่งใน 3 ประเภทต่อไปนี้

การป้อนข้อความ: หากต้องการให้ผู้ใช้พิมพ์ลงในช่องของคุณ คุณควรขยาย FieldTextInput
ตัวเลข: หากต้องการเก็บตัวเลขไว้ ควรขยายเวลาไว้ที่ FieldNumber
เมนูแบบเลื่อนลง: หากต้องการสร้างเมนูแบบเลื่อนลงแต่ต้องการจัดเก็บโมเดลอื่น สตริงหรือรูปแบบรูปภาพเริ่มต้น คุณควรขยาย FieldDropdown
- ข้อควรระวัง: ก่อนที่จะขยาย FieldDropdown โปรดตรวจสอบว่าช่องแบบเลื่อนลง ตัวเลือกการปรับแต่งไม่สามารถเติมเต็มความต้องการของคุณได้

ในบางสถานการณ์ คุณอาจต้องการขยายฟิลด์ประเภทอื่น สำหรับ ตัวอย่าง FieldLabelSerializable จะขยายไป FieldLabel

คลาสย่อย

import * as Blockly from 'blockly';

export class MyCustomTextField extends Blockly.FieldTextInput {

  constructor(value, validator, config) {
    super(value, validator, config);
  }
}

ตัวสร้างสำหรับคลาสย่อยของช่องดูคล้ายกับตัวสร้างสำหรับ ช่องที่กำหนดเอง ลายเซ็นของตัวสร้างย่อยควร มักตรงกับลายเซ็นของตัวสร้างระดับสูง

JSON และการลงทะเบียน

คุณควรลงทะเบียนช่องนี้เพียงครั้งเดียวด้วย

Blockly.fieldRegistry.register('my_custom_text_field', MyCustomTextField);

และนำ fromJson ไปใช้งานในชั้นเรียนเพื่อให้ใช้ร่วมกับ รูปแบบ JSON

static fromJson(options) {
  const value = Blockly.utils.parsing.replaceMessageReferences(options.value);
  return new MySubclassName(value);
}

โปรดดูข้อมูลเพิ่มเติมเกี่ยวกับการลงทะเบียนช่องที่ JSON และการลงทะเบียน ในส่วนการสร้างฟิลด์ที่กำหนดเอง