כלי פיתוח לבני גוש

Blockly Developer Tools הוא כלי מבוסס-אינטרנט למפתחים שיכול לעזור לך ליצור אבני בניין בהתאמה אישית ולכלול אותן באפליקציה שלך.

צילום מסך של ה-block Production, שבו רואים את ארגז הכלים ואזורי פלט שונים

הגדרת בלוק

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

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

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

תצורת פלט

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

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

פורמט של חסימת ייבוא

אתם יכולים לטעון את Blockly דרך תגי <script> ב-HTML, או להשתמש בדפי חשבון import אם משתמשים בכלי build באפליקציה. הבחירה הזו משפיעה על האופן שבו אתם מפנים לחלקים מסוימים ב-Blockly API. למידע נוסף על בחירת האפשרויות, קראו את מאמרי העזרה בנושא טעינת Blockly. לא משנה באיזו שיטה אתם משתמשים, הקפידו לבחור את האפשרות המתאימה ב-Block פקקים כדי שהקוד שהוספתם לאפליקציה יהיה מדויק לאפליקציה שלכם.

פורמט ההגדרה לחסימה

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

שפת מחולל הקוד

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

הפלט של הקוד

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

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

כותרות קוד

בקטע Code Headers (כותרות קוד) מוצג הקוד שנדרש כדי לטעון את ספריית הליבה של Blockly ואת מחולל השפות שבחרתם. יכול להיות שיש כאן גם הגדרות אחרות. לדוגמה, חלק מהשדות שאפשר לכלול בחסימה הם מיישומי פלאגין של Blockly. ליישומי הפלאגין האלה יהיו הצהרות ייבוא משלהם ויכול להיות שגם קוד אחר שתצטרכו להריץ כדי לאתחל את השדה. צריך לכלול את הקוד הזה לפני כל אחד מקטעי הקוד הבאים.

הגדרת חסימה

הגדרת הבלוק היא הדרך שבה מגדירים ל-Blockly את הצורה של הבלוק, למשל, אילו שדות וקלט יש לו, הצבע ועוד. אחרי הרצת הקוד הזה, Blockly ילמד איך ליצור בלוק רק על סמך type שלו.

אם אתם משתמשים באפליקציה לדוגמה, תוכלו לכלול את הקוד הזה בקובץ שנמצא בספרייה blocks/. אם יש לכם מבנה אפליקציה משלכם, הקפידו לכלול את הקוד הזה לפני שאתם מנסים להפנות לבלוק לפי שם, למשל בהגדרה של ארגז כלים. בכל מקרה, ודאו שכותרות הקוד נמצאות בקובץ שבו הוספתם את הקוד.

לשונית גנרטור

מחולל קוד הבלוק הוא האופן שבו מתארים את הקוד שצריך ליצור לבלוק. ה-Generative stub שנוצר על ידי ה-Block פקטור מספק את הקוד הבסיסי לקבלת ערכי הקלט והשדות שנמצאים בבלוק שלכם. באחריותכם לשלב את הערכים האלה עם הקוד הסופי שייווצר!

אם אתם משתמשים באפליקציה לדוגמה, תוכלו לכלול את הקוד הזה בקובץ שנמצא בספרייה generators/. אם יש לכם מבנה אפליקציה משלכם, הקפידו לכלול את הקוד הזה לפני שאתם מנסים ליצור קוד לסביבת עבודה שכוללת את הבלוקים בהתאמה אישית. בכל מקרה, ודאו שכותרות הקוד נמצאות בקובץ שבו הוספתם את הקוד הזה.

סרטון הדרכה

הסרטון הזה כולל הסבר מפורט על שלבי הגדרת בלוק. ממשק המשתמש לא עדכני, אבל תכונות החסימה שהוא מדגיש עדיין מדויקות יותר או פחות.

חסימת הספרייה

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

ייבוא ממפעל בלוקים מדור קודם

אם השתמשתם בגרסה הקודמת של Block Manufacturer ואתם רוצים להעביר את הגדרות הבלוקים הקיימות לכלי החדש, תוכלו לעשות זאת לפי השלבים הבאים:

  1. בגרסה הקודמת של Block Manufacturer, לוחצים על הלחצן Export Block Library בסרגל הכלים. תתבצע הורדה של קובץ עם כל הגדרות החסימות שלך.

    צילום מסך של ה-block Fact הקודם של Google, שבו הלחצן Export Block Library מודגש

  2. ביצרן החסימה החדש, לוחצים על הלחצן Load block בסרגל הכלים.

  3. בוחרים באפשרות 'ייבוא מחסימת היצרן' בתפריט.

    צילום מסך של ה-Block בקמפיין שבו מודגשים הלחצנים Load block ו-Import

  4. מעלים את הקובץ שהורדתם בשלב 1.

  5. הגדרות החסימה אמורות להמיר באופן אוטומטי לפורמט החדש, ועכשיו הן זמינות בתפריט Load block. יכול להיות שהשמות של הבלוקים השתנו אם היו התנגשויות עם בלוקים קיימים.

  6. אם היו שגיאות בניתוח הבלוקים, לא נוכל לטעון אותם. תוכלו לעזור לנו על ידי סימון באג ביחס לדגימות חסימה, והוספת הקובץ שלא ניתן לנתח.