ในการขยายช่องที่มีอยู่ คุณต้องจัดประเภทย่อยช่องข้อมูลที่มีอยู่แล้ว (เช่น
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 และการลงทะเบียน ในส่วนการสร้างฟิลด์ที่กำหนดเอง