Device Events
addEventListener, ומתי כל אחד מהאירועים מתרחש.addEventListener, בלי לתת לה שם.פרקי ההרצאה: Device Events
תמלול ההרצאה: Device Events
הטקסט המלא של הדקות הראשונות בהרצאה «Device Events» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
אחרי שראינו איך נראה פרויקט של פונגאפ ואיזה קבצים משתתפים בפרויקט של פונגאפ בואו ניכנס ונראה איך אנחנו משלבים קוד בפרויקט של פונגאפ וכאן אנחנו צריכים להכיר את עולם האירועים אז הנושא הזה זה אילו אירועים קיימים בטלפון נייד ואיך אנחנו יכולים
להירשם לאירועים האלה ולבצע קודים שונים כתלות באירועים האלה דבר ראשון הכנתי פה פרויקט חדש יש לי כמובן את כל הקבצים שאני צריך יש לי תגיעות המטה, לינק ל-JQuery מובייל, יש לי לינק ל-JQuery ולינק ל-CSS שלו, יש לי פה את הלינק לקורדובה ויש לי פה איזשהו לינק לסקריפט שפה אנחנו יכולים לכתוב קוד משלנו ב-JavaScript.
כמובן יש פה את המבנה של הדף הרגיל של JQuery מובייל. אז דבר ראשון, מה שאנחנו רוצים לבצע זה פעילות שמתרחשת כאשר האפליקציה נטענת.
הבריאות הזאת היא document.addEventListener זאת פונקציה של JavaScript שפשוט רושמת לנו איזשהו אירוע שבו אנחנו יכולים לכתוב קוד אז בואו נפתח סוגריים ואנחנו רוצים להירשם לאירוע מיוחד שקיים ב jQuery Mobile והוא נקרא device ready למעשה device ready לא שייך ל jQuery Mobile הוא שייך לפונגאפ למנוע של פונגאפ שזה הקורדובה
אז האירוע הזה בעצם אומר לנו תביאו לי פונקציה ואני פשוט אקרא לה כאשר המכשיר מוכן. זאת אומרת האפליקציה עלתה וכל מה שצריך נטען ואנחנו מסוגלים לתת הוראות למכשיר הנייד שלנו.
אז בואו נבנה פה איזושהי פונקציה שנקראת onDeviceReady. נעתיק את השם של הפונקציה ונכתוב אותה פה function onDeviceReady בצורה כזאת. אם אנחנו כאן מבצעים איזשהו אלרט ומציינים device is ready בואו נריץ ונראה מתי בדיוק האלרט מתבצע ctrl f5 נריץ את האמולטור ונראה שברגע שהאפליקציה עלתה אנחנו כבר רואים את האלרט חשוב שכל דבר
שאנחנו רוצים לבצע כאשר האפליקציה נטענת לא כאשר יוזר לוחץ על לחצן או משהו כזה אלא כאשר האפליקציה נטענת יתבצע בתוך פונקציה שמופעלת באירוע device ready ולא מתבצע לדוגמה פה.
גם כאן יכלתי לרשום איזשהו alert וה-alert הזה היה מתבצע כאשר האפליקציה הייתה נטענת אבל לא בטוח שה-device היה ready בשביל לתת לנו שירות ולכן הרבה דברים אנחנו הולכים לכתוב כאן בפונקציה המיוחדת הזאת.
עכשיו ישנם המון אירועים שאנחנו יכולים להירשם אליהם ששייכים לטלפון הנייד. אז בואו נירשם לכל אירוע ונראה בדיוק מתי הוא מתרחש.
כל אירוע כזה אנחנו נרשמים בצורה הסטנדרטית. דוקיומנט Add Event Listener. בואו נירשם לאירוע הראשון. פאוז. עכשיו כאן אנחנו רואים שאנחנו צריכים עוד פעם לתת פונקציה ואנחנו יכולים להשתמש בטריק ידוע של ג'אווה סקריפט שהוא מאוד מאוד נפוץ בפונגאפ
וזה בעצם פונקציית אינליין. פונקציית אינליין אומרת לנו תנו לי פה את הפונקציה אל תיתנו לה שם אם היא מקבלת ערכים ממי שקורא לה בבקשה תנו ערכים לפונקציה נניח a,b,c אם היא מקבלת פרמטרים אם לא פשוט שימו סוגריים ריקים שימו כאן סוגריים מסולסלים ריקים נהוג שבתוך סוגריים מסולסלים אנחנו יורדים שורה ונכנסים פנימה אבל כאן כתובה
הפונקציה הזאת זאת אומרת כאן אנחנו כבר יכולים לכתוב את הקוד במקום לכתוב את הפונקציה הזאתי חיצונית ואז לתת את השם שלה כמו שעשינו כאן. לא לשכוח שאנחנו נמצאים בפקודה ולכן אנחנו חייבים נקודה פסיקה. בואו נרשום פה איזשהו alert שאנחנו נמצאים באירוע שנקרא pause ועכשיו אנחנו צריכים להבין מתי pause מתרחש.
pause מתרחש כאשר האפליקציה שלנו עוברת להיות אפליקציית background, כלומר היא עדיין קיימת אבל יש אפליקציה אחרת שכרגע היוזר משתמש איתה על פני האפליקציה שלנו.
מה שאני רוצה לעשות זה פשוט להירשם לעוד הרבה אירועים אחרים להעלות אלרטים בכל אירוע וכך אנחנו הולכים לראות אילו אירועים קיימים לנו מבחינת הטלפון הנייד שאנחנו יכולים פשוט לרשום בהם מידע.
אירוע נוסף נקרא, בואו נרשום אותו פה, ריזיום. האירוע הזה מתבצע כאשר האפליקציה שלנו הופכת להיות שוב פעם פעילה. בואו נעתיק שוב פעם את זה.
האירוע הבא שאנחנו יכולים להירשם אליו נקרא און-ליין. האירוע הזה מתרחש כאשר האפליקציה שלנו או שהמכשיר טלפון יותר נכון הופך להיות אונליין מבחינת חיבור האינטרנט.
יש לנו פה אירוע נוסף שאנחנו יכולים להירשם אליו שנקרא אופליין. יוזר עולה על מטוס, נכנס למנהרה, מאיזושהי סיבה אחרת האינטרנט שלו הופך להיות לא פעיל, יש לנו אפשרות להשתמש באירוע אופליין.
בואו נירשם לאירוע נוסף. אירוע נוסף Backbatter. בכל אירוע אני מעלה אלרט, אחר כך נריץ את זה בבת אחת ונראה מתי האלרטים השונים עולים.
האירוע הזה מתרחש כאשר היוזר לחץ על לחצן ה-Back, Back Button, לחזור אחורה. כמובן האפליקציה שלנו צריכה להיות פעילה. בואו נירשם לאירוע נוסף, אירוע שנקרא BatteryStatus.
שימו לב, עדיף שזה יהיה K-Sensitive, כמובן לא לטעות בשום אותקן, לא לבצע טעויות תקלדה. האירוע BatteryStatus מתבצע כל פעם שיש שינוי בסטטוס של הסוללה של המכשיר הנייד שלנו, של היוזר כמובן.
אירוע נוסף שקיים לנו, בואו נירשם אליו פה, שימו לב שאני נרשם לכל האירועים האלה בתוך device ready, כי רק אז אני יכול בעצם לבצע פעילויות שקשורות למובייל.
האירוע הבא נקרא Battery Low. אתם יכולים לנחש מתי האירוע הזה מתבצע, נכון? כאשר הסוללה מגיעה למצב שנקרא Low. מצב שנקרא low זה לא המצב הכי קריטי שיכול להיות מבחינת הסוללה.
יש לנו אירוע נוסף שנקרא battery critical. האירוע הזה מתרחש כאשר הסוללה הופכת להיות די קריטית מבחינת level. אירוע נוסף, נדליק אותו פה, נקרא menu button.
האירוע הזה מתרחש כאשר היוזר לוחץ על לחצן של מניו. האירוע הבא נקרא search button. האירוע הזה מתרחש כאשר היוזר לוחץ על לחצן מיוחד של search שקיים במערכות הפעלה של אנדרואיד, טלפונים של אנדרואיד.
בואו נעבור לאירוע הבא. האירוע הבא נקרא Start Call Button. נעלה אלרט כזה. האירוע הזה מתרחש כאשר המשתמש לוחץ על לחצן Start Call.
בואו נבדוק עוד אירוע. End Call Button. האירוע הזה מתרחש כאשר היוזר לוחץ על לחצן סיום שיחה. בואו נירשם לשני אירועים נוספים.
סוליום דאון בטן והחבר שלו יהיה סוליום בטן פה סיימנו בעצם להירשם למגוון אירועים שהטלפון הנייד מאפשר לנו להירשם אליהם כמה הערות דבר ראשון כמו שראיתם לא כל האירועים מתרחשים בכל הטלפונים הסלולריים לדוגמה ראינו שהאירוע search button שייך רק לאנדרואיד כאן אנחנו רואים בעצם שפיתוח בפונגאפ מכיל איזשהו חיסרון
קטן שיכול להיות שדברים מסוימים יעבדו בטלפון א' אבל לא יעבדו בטלפון ב' כי טלפון ב' לא תומך בהם. אז פה לפעמים אנחנו צריכים אולי לבדוק אם אנחנו באמת רוצים את האירוע הזה או רוצים את הפעילות הזאת, איזה טלפון אנחנו נמצאים, איך לבדוק איזה טלפון אנחנו נמצאים, אנחנו נראה בהמשך.
אבל שימו לב שלא כל הדברים מתבצעים בכל הטלפונים. זאת נקודה חשובה שצריך לשים לב אליה במהלך הפיתוח, ובאמת הרבה פעמים קורה שאנחנו צריכים לבדוק את האפליקציה שלנו במגוון טלפונים ולראות אם באמת מה שעשינו תומך בזה.
כמובן שיש את הדוקומנטציה של מי תומך במה באתר של פונגאפ.קום. הערה נוספת היא שאני כרגע נרשמתי להמון אירועים אבל זה לא אומר שבמציאות אנחנו רוצים להירשם לכל האירועים האלה.
אם אני רוצה לבצע איזה פעולה מסוימת כשהיוזר מבצע ריזיום אז כמובן אני יירשם לריזיום אם אני לא רוצה לבצע פעולה כשהאיוזר עושה לי ריזיום לאפליקציה ואני לא יירשם אליה.
בדרך כלל אני לא יירשם כל כך הרבה לאירועי מערכת בלי באמת צורך לתכנת ביניהם קודם. כרגע רק רצינו לראות שהאירועים האלה עובדים, חלקם עובדים ומתי הם עובדים. הערה שלישית שחשוב לציין זה שיש מקרים שאנחנו לא יכולים לבדוק באמת דברים באמולטור.
לדוגמה, אולי האמולטור לא מאפשר לנו לבדוק האם הבטריה נגמרת, כי מבחינת האמולטור תמיד יש לו סוללה.
אז פה אנחנו צריכים לבדוק באמת אם אירוע כזה מתרחש ומתי הוא מתרחש בטלפון אמיתי. זאת אומרת, אנחנו צריכים לבנות את האפליקציה, לבנות ממנה קובץ התקנה, להתקין אותו, שנראה בהמשך איך עושים את זה, ואז כמובן לבדוק את זה על טלפון אמיתי.
אז יש דברים שהאמולטור, בגלל שהוא רק אמולטור ולא מכשיר אמיתי, מאפשר לנו באמת לבדוק. בואו נריץ את האפליקציה ונראה אילו אירועים מתרחשים.
דבר ראשון אנחנו רואים את ה-Device is Ready שראינו אותו גם מקודם. בואו נלחץ אוקיי ובואו נעבור עם לחצן Back ונראה שאירוע Back Batter נתבצע. זאת אומרת היוזר לחץ על לחצן Back ופתאום כמובן אנחנו יודעים את זה.
בואו נחזור נלך נניח לסטארט