יצירת רינדור חדש

כדי ליצור כלי לרינדור בהתאמה אישית, צריך ליצור מחלקה משנית למחלקה Renderer. עיינו במסמכי המושגים של כלי הרינדור למידע נוסף על רינדור ומה הוא עושה.

class CustomRenderer extends Blockly.blockRendering.Renderer {
  constructor() {
    super();
  }
}

ללא התאמה אישית, רינדור ברירת המחדל נראה כך:

כלי לעיבוד בסיסי

אפשר גם לתת מחלקה משנית לאחד מכלי הרינדור המובנים ואחר כך לשנות חלקים ממנו.

class CustomRenderer extends Blockly.thrasos.Renderer {
  constructor() {
    super();
  }
}

רכיבי רינדור אחרים של מחלקה משנית

צורת הבלוק בפועל נקבעת על סמך רכיבי המשנה של הרינדור.

כברירת מחדל, המחלקה Renderer מספקת גרסאות פעילות של כל רכיבי הרינדור. כך תוכלו לשנות רכיב אחד בלי לדאוג לגבי האחרים.

לדוגמה, אם רוצים לשנות את צורות החיבורים, אפשר לבטל את constants בלי לגעת ברכיבים האחרים.

עיינו במסמכי התיעוד של רכיבי הרינדור למידע נוסף על הפעולה של כל רכיב.

שינוי מברירת המחדל של שיטות המקוריות

אחרי שמשנים את הסיווג של רכיבי הרינדור, צריך לשנות את שיטות היצרן של Renderer לרכיבים שסיווגתם משנה. כך הוא מאפשר ל-Renderer לחבר בצורה תקינה את הרכיבים השונים יחד.

יש שיטה לכל סוג של רכיב:

רישום של כלי הרינדור

לבסוף, אחרי שתסיימו ליצור את הכלי לרינדור בהתאמה אישית, תצטרכו לרשום אותו. הפעולה הזו משייכת את ה-Renderer למחרוזת כדי שתוכלו להעביר אותה לתצורת ההזרקה.

Blockly.blockRendering.register('custom_renderer', CustomRenderer);

const workspace = Blockly.inject(blocklyDiv, {
  renderer: 'custom_renderer',
});