תכנות לילדים באמצעות Game Maker/טטריס/צעד 8: סיבוב דמות


תמונות לסיבוב עריכה

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

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

  1. להכנס לעריכת התמונה באמצעות הקלקה-כפולה על התמונה.
  2. ללכת לתפריט Transform ולבחור Resize Canvas.
  3. בחלון שנפתח, להוריד את הסימון מתיבת הסימון Keep aspect ratio כדי שנוכל לשנות את הדף מצורת מלבן ארוך לצורת ריבוע.
  4. בשדה הימני של רוחב הדף (Width) לשנות את הערך מ-16 פיקסלים ל-64 פיקסלים. מתחת לזה יש חצים בכמה כיוונים, וגם כפתור אמצעי. זה קובע לאיזה כיוון התמונה תהייה מיושרת. אנחנו לא רוצים שהתמונה תהיה באמצע (כי אז היא לא תהיה מיושרת לשריג), אז צריך ללחוץ על החץ שמצביע שמאלה, למשל, כדי שהתמונה תהיה מיושרת לשמאל. אז להקליק OK.
  5. ללחוץ על ה-וי הירוק.

עכשיו אפשר להוסיף לדמות עוד תמונה, שבה יהיה הקו השוכב. ל-Game Maker יש דרך מובנית לעשות את זה. בשביל זה צריך:

  1. ללכת לתפריט Animation.
  2. לבחור Rotation Sequence. בתת-תפריט שצץ לבחור Clockwise.
  3. השדה הראשון אומר כמה תמונות יהיו ברצף - לכתוב שם 2 כי הקו יכול להסתובב רק לשתי צורות: שוכב ועומד.
  4. השדה השני אומר איזה זווית צריך לכסות בכל הסיבובים האלה. שם צריך לכתוב 180. (360 מעלות זה סיבוב מלא, אבל במקרה של הקו אחרי חצי סיבוב הוא שוב חוזר להיות קו עומד, אז מספיק 180 מעלות.)

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

אחרי שגמרנו, אפשר ללחוץ על ה-וי הירוק ולבדוק מה יצא.


  מה קורה כשמוצג קו?




הדמות של הקו מוצגת מונפשת - התמונות שלה מתחלפות במהירות. צריך לשנות את מהירות ההנפשה ל-0 כדי שהדמות לא תזוז. אפשר לעשות את זה באמצעות הפעולה לשינוי דמות  , אבל אפשר גם לקבוע את הערך של המשתנה image_speed (אִימֵג' סְפִּיד) - מהירות תמונה. לכן נלך לארוע היצירה של אובייקט הצורה ונוסיף שם פעולת הצבה   שבה נציב במשתנה image_speed את הערך 0. את הפעולה הזאת צריך להעתיק גם לארוע היצירה של אובייקט הצורה הבאה.


  עכשיו הקו נראה בסדר.




הפעלת הסיבוב עריכה

הצורה צריכה להסתובב כשהמשתמש לוחץ על חץ למעלה. לכן נוסיף לאובייקט הצורה ארוע הקשה על מקש חץ למעלה (Up)  . בארוע הזה צריך לשנות את התמונה המוצגת מתוך התמונות בדמות. גם את זה אפשר לעשות באמצעות הפעולה לשינוי דמות  , אבל גם הפעם נעדיף לעשות את זה באמצעות הצבה למשתנה שקובע את התמונה המוצגת: image_index (אִימֵג' אִינְדֵקְס) - סמן תמונה. לכן נוסיף פעולת הצבה   ובה נגדיל את ב-1 את image_index (לסמן Relative).


  מה קורה אם לוחצים על חץ למעלה כשנופל קו? ומה קורה כשמופיע הקו הבא?



כשהדמות מתחלפת, זה לא משנה את המשתנה image_index. אם רוצים שהקו יופיע תמיד באותה צורה, צריך להחזיר את הערך של image_index ל-0 כשמחזירים את הצורה למעלה:

  1. ללכת לנחיתה של הצורה (בארוע המשתמש  ).
  2. אחרי הפעולה שמחזירה את הצורה חזרה למעלה, להוסיף פעולת הצבה   ובה לשנות את image_index חזרה ל-0.

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




 

כדאי לדעת:

בפעולה לשינוי דמות   יש שלושה שדות: sprite, subimage, ו-speed. ראינו שאפשר לשנות כל אחד מהם גם באמצעות פעולת הצבה למשתנה  : sprite_index, image_speed, ו-image_index.

כלומר: פעולת שינוי הדמות פשוט קובעת את הערכים של שלושת המשתנים האלה.

יש עוד פעולות כאלה, שפשוט קובעות ערכים של משתנים. למשל:

  •   פעולת תנועה מדוייקת קובעת את הערך של המשתנים direction ו- speed.
  •   פעולת העברה למקום אחר קובעת את הערך של המשתנים x ו-y.
  •   פעולת קביעת התנועה האופקית קובעת את הערך של המשתנה hspeed.

התנגשות עריכה

בואו נעשה נסיון: תפעילו את המשחק, חכו שייפול קו, סובבו אותו ככה שיעמוד, ואז הזיזו אותו שמאלה עד הסוף - עד לגבול. אז נסו ללחוץ על חץ למעלה כדי לסובב אותו. מה קורה?

אנחנו מרשים לצורה להסתובב גם אם יש התנגשות. צריך לבטל את הסיבוב במקרה של התנגשות:

  1. ללכת לארוע הלחיצה על חץ למעלה  .
  2. אחרי פעולת ההצבה, לשים את הפעולה לבדיקת התנגשות   כדי לבדוק אם הצורה מתנגשת במשהו (גבול או ערימה). לא לשכוח לסמן Relative כדי לבדוק התנגשות במקום שבו הצורה נמצאת.
  3. אם יש התנגשות, לבטל את הסיבוב: להוסיף פעולת הצבה   ובה להציב אל המשתנה image_index את הערך -1 ולסמן Relative.

  מה קורה עכשיו כשמנסים לסובב את הקו ליד הגבול?




שאר הצורות עריכה

עכשיו נוכל להוסיף תמונות גם בשביל שאר הצורות.

 

עכשיו תורכם:

להוסיף תמונות מסובבות לדמויות S ו-Z, כמו שעשינו לקו. (בדמויות האלה צריך להגדיל את הנייר ל-48 פיקסלים.)

   

את הצורות L, J ו-T צריך לסובב סיבוב שלם. אחרי שמגדילים את הנייר שלהן ל-48 פיקסלים, צריך לבחור שבהנפשת הסיבוב יהיו 4 תמונות ו-360 מעלות.


  עכשיו אפשר לסובב את כל הצורות.




המשך העבודה עריכה

השלמנו כמעט את כל הרשימה:

  • אובייקט לצורת הריבוע
  • נפילה
  • תנועה ימינה ושמאלה כשלוחצים על החצים
  • להערם בסוף הנפילה
  • לתכנת את שאר הצורות
  • לבחור את צבע הערימה לפי צורה
  • לבחור צורה באופן אקראי
  • לסובב את הצורות כשלוחצים על חץ למעלה
  • להעלים שורות שלמות

עכשיו המשתמש יכול לשלוט ביצירת הערימה; לכן כדאי לבדוק איך היא נראית - צעד 9: מילוי שורות