מה זה Drawing API?
הDrawing API הוא השם לסדרת פונקציות שמאפשרות לנו ליצור ציורים בפלאש באמצעות קוד בלבד.
כדי להבין איך זה פועל צריך לדעת שהDrawing API משתמש בכלי עט ( Brush tool) וירטואלי, זאת אומרת שאנחנו כאילו משתמשים בכלי הזה אבל במקום להזיז ולצייר עם העכבר אנחנו "מזיזים" אותו עם קוד.
אז מה עושים?
השלב הראשון בעבודה הוא ליצור מובי קליפ חדש
קוד:
createEmptyMovieClip("mc", depth);
הפקודה יצרה מובי קליפ חדש,ריק, בעל השם mc והעומק depth (אפשר לשים פה מספר גבוה ובלי סיבוכים מיותרים זה יעבוד)
אוקי אז כשיש לנו את המובי קליפ מוכן אנחנו יכולים להתחיל לצייר בתוכו!
קודם כל איזה צבע ועובי אנחנו רוצים שלעט שלנו יהיה?
את זה קובעים עם הפונקציה:
קוד:
mc.lineStyle(thickness,color,alpha);
thickness - עובי העט שבו תציירו
color - צבע העט, הצבע בא בערכים הקסאדצימלים, אז יש פה טריק איך לגלות את הערך הזה, אני ירחיב על זה במדריך הבא,בכל אופן כדי לצייר בצבע שחור צריך לשים שם 0.
alpha - שקיפות העט - מספר בין 0 ל100.
שימו לב- הפקודה הזאת חייבת להופיעה לפני שנתחיל לצייר, כי אם לא כלום לא יופיע.
אז כמו בחיים אנחנו יכולים להזיז את העט או לצייר איתו
הזזת העט:
הפקודה הזאת מזיזה את העט שלנו למקום (x,y)
ציור קו עם העט:
הפקודה הזאת מצייר קו מהמיקום הנוכחי של העט עד לנקודה (x,y).
שימו לב: כשהעט מצייר קו הוא גם זז! זאת אומרת שכשנרצה לצייר עוד קו הוא יתחיל מהנקודה שאליה ציירנו את הקו הקודם!
ציור קו מעוקל עם העט:
קוד:
mc.curveTo(controlX,controlY,anchorX,anchorY)
כדי לצייר קט מעוקל צריך בעצם שתי נקודות:
1- anchorX,anchorY שהם הנקודה שבו הקו יסתיים
2- controlX,controlY שהם הנקודה שאליה הקו שלנו יסטה כדי שהוא יהיה מעוקל
שימו לב: גם כאן כשהעט מצייר הוא גם זז!
עד עכשיו עברנו רק על איך לצייר קו, ב Drawing API יש גם פונקציה שמאפשרת למלא את הצורה שציירנו בצבע:
קוד:
mc.beginFill(color,alpha)
color- הצבע שבו אנחנו רוצים למלא את הצורה, גם פה הצבע מופיע בצורה של מספר בבסיס הקסאדצימלי, ואני ירחיב על איך מוצאים ערך מספרי לצבע בהמשך.
alpha- אחוז השקיפות של הצבע, פה יבוא מספר בין 0 ל 100.
הפונקציה הזאת תופיע
לפני שהתחלנו לעשות כל דבר אחר בציור, זאת אומרת לפני ה moveTo(x,y) הראשונה.
כשנתחיל לצייר קווים עם lineTo או curveTo, אם הצורה שיוצאת סגורה היא תתמלא בצבע שקבענו לפני, אם לא אז פלאש יסגור אותה אוטומטית וימלא אותה בצבע.
בשנרצה לסים לצבוע את הצורה נכתוב את הפקודה:
טוב, כאן בעצם סיימנו לעבור על הפונקציות של הDrawing API.
לסיום אני יביא דוגמא:
קוד:
createEmptyMovieClip("mc", 100);
mc.lineStyle(3,0,100);
mc.beginFill(0x2052A4,100);
mc.moveTo(50,50);
mc.lineTo(100,100);
mc.lineTo(200,100);
mc.curveTo(250,200,200,200);
mc.lineTo(50,250);
mc.endFill();
הקוד הזה יצייר את הצורה
הזאת
סיימתי לכתוב את המדריך הראשון שלי!!
אני יכתוב עוד מדריכים למה שאפשר לעשות בעזרת מה שלמדנו פה בהמשך
תהנו