Dynamic Menu

תמלול ההרצאה: Dynamic Menu

הטקסט המלא של הדקות הראשונות בהרצאה «Dynamic Menu» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:02

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

2. 00:18

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

3. 00:33

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

4. 00:45

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

5. 01:07

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

6. 01:31

   אליהם ולראות את התמונות האחרונות שהוא ראה אז בואו בואו נבנה את זה ותוך כדי נראה איך אנחנו מוסיפים את הפריטים לתפריט.

7. 01:39

   בואו ניקח כאן איזשהו Edit Text, בואו ניקח Match Parent, Wrap Content ובואו נגדיר כאן איזשהו Text Size, בואו ניקח 20 ובואו ניתן ID, ניקח Edit Text Animal והנה יש לנו Edit Text שמאפשר לנו להכניס שמות של חיות.

8. 02:06

   מתחתיו אנחנו רוצים Image View, בואו נגדיר לו גם כן ID, view animal ובאימג' view הזה אנחנו רוצים להציג לו את התמונה. בגלל שאנחנו נמצאים ב-relative layout אז בואו נגדיר שהאימג' view תהיה be low edit text animal ואז היא תופיע מתחתיו כדי שהמשתמש גם ידע מה אנחנו רוצים ממנו בואו ניתן

9. 02:40

   לו פה איזשהו hint enter animal name ותוך כדי ההקלדה אנחנו רוצים לבדוק האם תמונה קיימת אם כן אנחנו מציגים אותה אם לא אנחנו לא מציגים, יש לנו כאן בדרובל רשימה של תמונות של חיות והיוזר יכול להקליד כל אחת מהן ואז לראות אותן בתמונה, אוקיי אז אנחנו רוצים עכשיו לגשת ולקחת את הערכים האלה ולהשתמש איתם אז

10. 03:13

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

11. 04:07

    מקש עבור האדיטקסט אז האירוע שאנחנו רוצים להירשם נקרא set on key listener בואו נגדיר פה this נבצע make Main Activity Implement on Key Listener, Turner Directive, אוקיי, ואם יש לנו אירוע שיכול להתבצע או שבאמת מתבצע

12. 04:32

    בכל לחיצה על מקש. לפי מה שראינו בעבר האירוע הזה on key מתבצע פעמיים בלחיצה על מקש, פעם אחת ברגע הלחיצה ופעם אחת ברגע העזיבה. אנחנו רוצים שרק אם אנחנו בעזיבת המקש אז לבצע את הקוד שלנו.

13. 04:51

    איך אנחנו יודעים אם אנחנו בעזיבת המקש? אז יש לנו אפשרות לבדוק את המשתנה event שנשלח לפונקציה הזאת, ויש לו אפשרות לקבל את האקשן שהתבצע.

14. 05:02

    אם האקשן שהיוזר עשה, כלומר איזה סוג של event שהתבצע כאן הוא שונה מ-KeyEvent.ActionUp זאת אומרת שאנחנו לא ב-ActionUp יכול להיות שאנחנו ב-ActionDown אולי יכול להיות עוד דברים שקרו אבל אנחנו לא ב-ActionUp אז אנחנו רוצים לא לבצע דבר

15. 05:25

    ולהחזיר false שאומר שאנחנו לא טיפלנו באירוע הזה אם אנחנו עברנו בהצלחה את האיף הזה, זאת אומרת שעכשיו היוזר עזב את המקש וזה מתבצע על כל מקש שהיוזר לחץ.

16. 05:39

    מה אנחנו רוצים לעשות? אנחנו רוצים עכשיו לקחת את הטקסט ולבדוק אם יש לנו תמונה כזאת כן או לא. אם קיימת לנו תמונה כזאת אנחנו רוצים להציג אותה ב-image view.

17. 05:51

    אז ראשית בואו נקבל את ה-string animal שהיוזר כתב. איך אנחנו עושים את זה? בואו ניגש ל-Edit, טקסט, Get, טקסט, 2-String ובואו נהפוך את הכל ל-2-LowerCase כי זה לא משנה לי Capital Letters או Lower Letters אם היוזר רשם אני רוצה להציג לו את

18. 06:14

    החיה הזאת. הדבר הבא שאנחנו רוצים לעשות זה לקחת את ה-Image ID, כלומר מה ה-Resource ID של התמונה.

19. 06:24

    איך עושים את זה? אז ראינו בעבר שאנחנו יכולים פשוט לגשת ל-Get שם לגשת ל-Get Identifier, לגשת ולתת לו את ה-animal, את השם של החיה שאנחנו רוצים, אנחנו רוצים שהוא יבדוק את תקיית דרובל, ואנחנו צריכים להעביר פרמטר שלישי - Get Package Name בצורה כזאת.

20. 06:50

    והנה יש לנו את ה-ID עצמו של התמונה, שיכול להיות שזאת תמונה אמיתית ואז ה-ID הוא ID ספציפי של התמונה, או אם היוזר הכניס מחרוזת שלא קיימת בתמונות, אז ה-image ID תוחזר כ-0.

21. 07:05

    אז אנחנו רוצים לבדוק האם ה-image ID היא לא 0. אם היא לא 0, קיימת לנו תמונה כזאת. אז אנחנו רוצים לגשת ל-image view animal, ו-to set image resource, ולתת את ה-image ID, וזה בעצם יציג את התמונה.

22. 07:24

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

23. 07:48

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

24. 08:08

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

25. 08:22

    אז אנחנו כמובן צריכים בהתאם לבחירה של היוזר בהתאם לתמונות שהוא רואה או כותב אנחנו צריכים להוסיף אותן בלבד לתפריט.

26. 08:32

    אז בואו נמשיך ונראה איך עושים את זה. הדבר הראשון שאנחנו רוצים לעשות זה לשמור כאן באזור הגלובלי את שלושת התמונות האחרונות שהיוזר בחר בהן או כתב אותן.

27. 08:46

    בואו ניגש ל-Private ArrayList של סטרינג בכדי לשמור כאן באזור הגלובלי את ה-Recent Animals. בואו נגדיר New ArrayList בצורה כזאת והנה יש לנו מערך שבו אנחנו רוצים לשמור רק את שלושת התמונות האחרונות.

28. 09:09

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

29. 09:27

    אז בואו ניגש ל-add ונוסיף animal והנה שמרנו את השם של החיה, אבל כמובן שהיוזר יכול להוסיף הרבה הרבה הרבה תמונות שונות.

30. 09:37

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

31. 10:10

    הכניס פעמיים את החיה deer ואז אנחנו בעצם לא רוצים להכניס לו עוד פעם את החיה deer כי היא כבר קיימת יש פה עוד לוגיקות שאתם יכולים להוסיף אני אני אשאר כרגע עם simple אני לוקח את השלוש תמונות האחרונות שהיוזר כתב כעת אנחנו רוצים להוסיף את זה לתפריט עכשיו ראינו שיש שלושה סוגים שונים של תפריטים ולמעשה לכל סוג יש שיטה קצת אחרת להוסיף בצורה דינמית אליה פריטים

32. 10:42

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

33. 11:10

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

34. 11:29

    אבל אז הוא כמובן יגדל ויגדל. לאחר מכן אנחנו רוצים לגשת ו-to add איזושהי כותרת, בואו נגדיר recent animals. ולבסוף אנחנו רוצים לרוץ בלולאה על recentanimals.size ואנחנו רוצים לגשת למניו ולהוסיף recentanimals.get והנה קיבלנו את הפריט ה-i והוספנו אותו.

35. 12:05

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

36. 12:27

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

37. 13:03

    התמונה בואו נגדיר רק toString ואפילו toLowerCase אז הנה יש לנו את השם של החיה שהיוזר בחר מהתפריט יופי אז אנחנו יכולים לבצע בדיוק את מה שעשינו כאן הנה יש לנו פה את השם שאנחנו שולחים לפונקציה getIdentifier מקבלים את האימג' ומוסיפים אותו אנחנו לא נצטרך את כל ההוספה למערך כמובן אז אני רגע אעתיק את כל אלו

38. 13:31

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

39. 13:48

    Good. בואו נריץ. בואו ניגש ונרשום כאן "deer" ונפתח את התפריט, ונראה שהתווספה המילה "deer". בואו נמחק ונרשום "panda".

40. 14:06

    צגת פנדה, והנה אנחנו רואים "deer" ו"panda". בואו נמחק ונרשום "kitten", והנה מוצג חתלתול, ואנחנו רואים את שלושת החבר'ה האלה.

41. 14:17

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