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

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

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

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

כלי לרינדור בסיסי

אפשר גם ליצור מחלקה משנית של אחד מהכלים המובְנים האחרים ואז לעקוף חלקים ממנו.

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

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

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

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

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

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

שינוי שיטות היצרן

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

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

makeConstants_
makeRenderInfo_
makePathObject (שימו לב שאין קו תחתון)
makeDrawer_

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

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

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

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