יצירה של סביבת עבודה

סביבת עבודה של Blockly היא הרכיב ברמה הגבוהה ביותר ב-Blockly. זהו ממשק המשתמש שבו משתמשים כדי לתכנת באמצעות בלוקים.

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

תג div של הזרקה

צריך להוסיף סביבת עבודה של Blockly ל-<div> שנקרא 'injection div'.

אפשר להגדיר את הגודל של ההוספה div באופן סטטי או באופן דינמי. רכיבי Blockly בתוך div מעדכנים את הגודל שלהם כשהחלון משנה את הגודל.

בקטע הקוד הבא מוצג ה-HTML של הזרקה בגודל קבועdiv:

<div id="blocklyDiv" style="height: 480px; width: 600px;"></div>

הזרקה

ההזרקה יוצרת את כל רכיבי המשנה ב-HTML שמרכיבים את ממשק המשתמש של סביבת עבודה. הוא גם מבצע את כל ההפעלה הראשונית שנדרשת כדי להכין את סביבת העבודה לשימוש.

פונקציית ההוספה יכולה לקבל את המזהה של הוספת div או את הוספת div עצמה:

// Passes the ID.
const workspace = Blockly.inject('blocklyDiv', { /* config */ });

// Passes the injection div.
const workspace = Blockly.inject(
    document.getElementById('blocklyDiv'), { /* config */ });

הגדרה

אפשר להגדיר את סביבת העבודה עם אפשרויות רבות (כמו פריסה וסגנון) במהלך ההחדרה.

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