יצירת לחצן מונפשיצרת את הלחצן הראשון שלך, ובודאי נוכחת באיזו קלות עשית זאת - יצירת לחצן בפלאש פשוטה כמעט כמו ציור עיגול... הכל מסתכם בהצבה של גרפיקה בפריימים השונים של הלחצן.
יצירת לחצן מונפש פשוטה כמעט כמו יצירת הלחצן שכרגע יצרת, ההבדל היחידי הוא בכך שבמקום לצייר צורה סטטית בפריימים השונים של הלחצן יש להציב סמל מסוג MovieClip בפריים הרצוי.
אם תציב MovieClip בפריים המסומן Over , בכל פעם שסמן העכבר ירחף מעל הלחצן יתנגן ה- MovieClip . על אותו עיקרון אם תציב MovieClip בפריים Up הוא יתנגן כל זמן שסמן העכבר אינו מרחף מעליו.הבה נבנה לנו כפתור מונפש. הכפתור הזה יהיה מתוחכם יותר מהקודם - גם הפעם חזות הכפתור תהיה עיגול אדום, אבל הפעם בריחוף העכבר מעל הכפתור העיגול יקטן תוך כדי הנפשה ויגדל חזרה עד שסמן העכבר יצא מגבולות הלחצן.
מכיוון שהמטרה שלנו במאמר היא לדון בלחצנים מונפשים ולא ביצירת קליפים, יצרתי עבורך את הקובץ הראשוני המכיל סמל אשר ישמש אותך כהנפשה בפריים Over .1) פתיחת הקובץ: הורד את הקובץ מכאןופתח אותו בעזרת בחירת File > Open מהתפריט הראשי. הבט בספרייה, תוכל לראות סמל מסוג MovieClip בשם Over MC . (הסיומת MC היא סימון אוניברסלי ל- MovieClip בקרב מפתחים בפלאש).
2 ) יצירת הלחצן: צור סמל חדש בעזרת בחירת Insert > New Symbol או בלחיצה על Ctrl+ F8 . הענק לסמל את השם SecondButton וקבע את התנהגותו כ- Button . לחץ OK לאישור, פלאש תשלח אותך למצב עריכת סמל.
3) עריכת הפריים Up : בדיוק כמו בתרגול הקודם, צייר עיגול בגודל 50 על 50 בעל קו שחור ומילוי כחול. הצב אותו במרכז משטח העבודה.
4) עריכת הפריים Over : כאן מתחיל השינוי, גרור מופע של הסמל Over MC מהספריה לתוך הפריים, והצב אותו במרכז משטח העבודה. בזאת בעצם מסתכמת לה יצירת ההנפשה.
5) בדיקה והרצה: צא ממצב עריכת סמל ועבור למצב עריכת קו - הזמן הראשי. הצב מופע של הלחצן החדש שיצרת בפריים הראשון של קו - הזמן הראשי. בחר Control > Test Movie מהתפריט הראשי בכדי להריץ את הסרטון. תוכל לראות עיגול כחול על המסך, זהו הפריים Up . העבר את סמן העכבר מעל הלחצן ותראה את הקליפ מתנגן, הפריים המוצג עכשיו הוא Over . לחץ על הכפתור השמאלי של העכבר ותראה שההנפשה פוסקת והפריים Up מופיע, זאת מפני שלא הגדרנו כל גרפיקה בפריים Down . לפניך התוצאה הסופית:
סיכום
תאמין או לא, זה כל הסיפור. כרגע יצרת לחצן מונפש: בשלב הראשון יצרת MovieClip , לאחר מכן יצרת סמל מסוג לחצן ולבסוף הצבת את ה- MovieClip בפריים הרצוי, במקרה הזה, Over .מכיוון שניתן להציב בעצם כל דבר בפריים, כדאי שאזהיר אותך מפני כמה מצבים : אל תנסה להציב מופע של לחצן בתוך פריים של לחצן אחר, זה יוצר תוצאות בלתי צפויות. לצערי אני לא יכול לגבות את המידע הזה משום מקור מוסמך אלא רק מניסיוני האישי.
אם ממש תתחכם תנסה להציב מופע של לחצן בתוך אחד הפריימים שלו, זה אמנם מקורי, אבל פלאש תגן עליך מפני עצמך ותציג תיבת דיאלוג שתציג את ההודעה: You cannot place a symbol inside itself .
|
מיקום: Flash - פלאש > מאמרים ודוגמאות קוד
|
|
על לחצנים, לחצנים מונפשים בפלאש גיל כהן פלאש מאפשרת למפתח ליצור אינטראקטיביות בעזרת אלמנטים שונים, שהפופולרי מביניהם הוא הלחצן. הלחצן הוא כלי בעזרתו מפתח יכול לאפשר למשתמש לבצע בחירה, לתקשר עם האפליקציה. על לחצנים, לחצנים מונפשים ומה שביניהם / גיל כהן
הקדמה
פלאש מאפשרת למפתח ליצור אינטראקטיביות בעזרת אלמנטים שונים, שהפופולרי מביניהם הוא הלחצן. הלחצן הוא כלי בעזרתו מפתח יכול לאפשר למשתמש לבצע בחירה, לתקשר עם האפליקציה. בפלאש הלחצנים קלים מאוד ליצירה וניתן להוסיף להם דינאמיות רבה בכל הנוגע למראה וההתנהגות שלהם. במאמר זה אנו נתמקד ביצירת כפתורים מונפשים. תחילה נלמד כיצד בנוי לחצן וניצור את הלחצן הראשון שלנו, משם נעבור ונלמד כיצד יוצרים לחצן מונפש ונתרגל יצירה של לחצן כזה. כיצד בנוי לחצן?
כל לחצן יכול להיות באחד משני מצבים בסיסיים : לחוץ או לא לחוץ. את המצב השני ניתן לחלק לשני מצבים נוספים: במצב אחד העכבר מרחף מעל הלחצן ובמצב השני העכבר איננו מרחף מעל גבולות הלחצן. ההבחנה הזו שיוצרת לנו בעצם שלושה מצבים בהם יכול לחצן להיות, תאפשר לנו בהמשך המאמר ליצור לחצן מונפש. המפתחים ב- MacroMedia חשבו כבר על שלושת המצבים השונים ונתנו לנו כלי נוח לפיתוח לחצנים אשר יכולים להגיב לכל אחד מהמצבים. אם תסתכל על קו - הזמן של הלחצן באיור המצורף תוכל לראות ארבעה פריימים, כאשר הראשון מכונה Up השני Over , השלישי Down והרביעי Hit – בו נדון מאוחר יותר.
 הרעיון הוא שכל פריים כזה מייצג מצב שונה באינטראקציה עם המשתמש, כל פריים כזה יוצג בהתאם לפעולות המשתמש: אם לדוגמא המשתמש לוחץ על הלחצן – הפריים Down יוצג, אם המשתמש עומד עם סמן העכבר מעל הלחצן אך איננו לוחץ על כפתור העכבר – הפריים Over יוצג, ואם המשתמש יזיז את סמן העכבר מחוץ לגבולות הלחצן – יוצג הפריים Up .
לחיצה על העכבר מחוץ לגבולות הלחצן תציג את הפריים Up , כי למרות שהמשתמש לוחץ על העכבר - הסמן נמצא מחוץ לגבולות הלחצן. במידה ולא מוגדר דבר בפריים Over , הגרפיקה המצויה בפריים Up תוצג ברגע שסמן העכבר ירחף מעל הלחצן, כנ " ל לגבי הפריים Down : במידה והפריים לא מוגדר, הגרפיקה המצויה בפריים הקודם תוצג במקרה של לחיצה על הלחצן. יצירת הלחצן הראשון
הבה נלכלך את הידיים שלנו בקצת פלאש וניצור לחצן עגול ואדום, אשר בריחוף העכבר מעליו משנה את צבעו לכחול ובלחיצה משנה את צורתו לריבוע. 1) יצירת קובץ חדש: פתח קובץ חדש בעזרת בחירת File > New מהתפריט הראשי. 2) יצירת הלחצן: צור סמל חדש בעזרת בחירת Insert > New symbol מהתפריט הראשי, או על ידי לחיצה על Ctrl+F8 במקלדת. בתיבת הדיאלוג שתופיע, הענק לסמל את השם FirstButton וקבע את התנהגותו כ- Button . לחץ OK . פלאש תעביר אותך למצב עריכת סמל, המצב בו תוכל לפתחאת הלחצן החדש. תוכל לראות שמעל קו - הזמן פלאש מודיעה לך בדיוק איזה סמל אתה עורך כרגע, במקרה שלנו סמל זה נקרא FirstButton .  3) עריכת הפריים Up : צייר עיגול בגודל 50 על 50 פיקסלים, בעל מילוי ( fill ) בצבע אדום וקו גבול ( stroke ) בצבע שחור.
4) עריכת הפריים Over : הפוך את הפריים השני לפריים מפתח ( KeyFrame ) בעזרת בחירת Insert > Timeline > keyFrame מהתפריט או על ידי לחיצה על F6 . התוכן של הפריים הקודם הועתק לפריים זה. שנה את צבע המילוי בעיגול לכחול. 5) עריכת הפריים Down : הפוך את הפריים Down לפריים מפתח. התכולה של הפריים הקודם שוב מועתקת לפריים החדש. הפעם מחק תוכן זה, וצור במרכז המסך ריבוע בגודל 50 על 50 במילוי אותו צבע כחול שהשתמשת בו לציור העיגול בפריים Over . 6) בדיקה והרצה – צא ממצב עריכת סמל ועבור למצב עריכת קו - הזמן הראשי בעזרת לחיצה על שם הסצינה הנמצא מעל קו - הזמן בצד שמאל של המסך, במקרה שלנו שם הסצנה הוא Scene 1 . הצב מופע של הלחצן החדש שיצרת בפריים הראשון של קו - הזמן הראשי.
בחר ב- Control > Test Movie מהתפריט הראשי בכדי להריץ את הסרטון. תוכל לראות את עיגול אדום על המסך, הלחצן מציג עכשיו את פריים Up .
העבר את סמן העכבר מעל הלחצן ותראה שצבע העיגול משתנה לכחול. הפריים המוצג עכשיו הוא Over . לחץ על כפתור העכבר ותראה שהעיגול נעלם ובמקומו מופיע ריבוע כחול, הפריים המוצג עכשיו הוא הפריים Down .
דירוג:
תגובות הגולשים
הוסף תגובה |