PracticU

Alert Dialog

בלי כתוביותעם כתוביות
PracticU › קורס פיתוח אפליקציות - לאנדרואיד - Android - ב-JAVA › Alert Dialog
מילון מושגים:
כפתור - רכיב בממשק המשתמש שהמשתמש לוחץ עליו כדי להפעיל פעולה, כמו שליחת טופס או מעבר לדף אחר.
פונקציה - קטע קוד בעל שם שמבצע משימה מוגדרת, מקבל ערכי קלט (פרמטרים) ויכול להחזיר תוצאה. מאפשרת לארגן קוד ולהשתמש בו שוב.
מחרוזת - סוג נתונים שמייצג רצף של תווים, כלומר טקסט, ומשמש לאחסון מילים, משפטים או כל רצף סימנים.

Alert Dialog
תיבת דו-שיח (Dialog) מוצגת מעל המסך כדי להציג הודעה או לקלוט מידע, ולחייב את המשתמש להגיב לפני שימשיך. בשיעור בונים AlertDialog של אישור מחיקת מוצר בשתי דרכים.
השלבים העיקריים
1. יצירה: AlertDialog.Builder(this) ואחריו create(), כשה-this הוא ה-Context.
2. תוכן: setMessage להודעה, setTitle לכותרת ו-setIcon לאייקון מתיקיית drawable. רק show() מציג את התיבה בפועל, והמסך מתכהה מאחוריה.
3. שלושה כפתורים: setButton מקבל קבוע DialogInterface.BUTTON_POSITIVE, BUTTON_NEGATIVE או BUTTON_NEUTRAL, טקסט ומאזין. המשמעות נקבעת על ידכם: למשל positive = Yes, negative = No, neutral = More Info.
4. המאזין: ממשים DialogInterface.OnClickListener, לא את ה-OnClickListener הרגיל. אם Alt+Enter לא מוסיף אותו, כותבים את המימוש ידנית ואז Implement Methods. ב-onClick(dialog, which) בודקים את which מול הקבוע, ומציגים Toast מתאים.
5. מניעת סגירה בטעות: כברירת מחדל לחיצה מחוץ לתיבה סוגרת אותה בלי להפעיל קוד. setCancelable(false) מבטל זאת, והמשתמש חייב לבחור כפתור.
6. שיטת Builder: בלי create, ממשיכים לשרשר: setIcon, setTitle, setMessage, setCancelable(false), setPositiveButton, setNegativeButton, setNeutralButton, ובסוף show(). כל פונקציה מחזירה את אותו Builder. הפונקציות של הכפתורים כאן מקבלות מחרוזת ומאזין, ללא קבוע.
שימו לב
- הכותרת "Builder Design Pattern" נוגעת לשרשור הזה. מקובל לרדת שורה לפני כל נקודה.
- בשיעור ההודעות הן רק Toast. במציאות כאן מבצעים את המחיקה.
אחרי השיעור אפשר להציג AlertDialog עם כפתורי כן/לא/מידע נוסף ולהגיב לבחירה, בשתי שיטות.
השיעור הבא בקורס: List Dialog

פרקי ההרצאה: Alert Dialog

  1. 00:00

    מהו Dialog ולמה צריך אותו

  2. 02:48

    יצירת AlertDialog בעזרת Builder

  3. 03:44

    הגדרת הודעה, כותרת ואייקון

  4. 05:21

    לחצני Positive, Negative ו-Neutral

  5. 07:22

    מימוש DialogInterface.OnClickListener

  6. 09:59

    זיהוי הלחצן שהמשתמש לחץ

  7. 12:00

    לחצן Neutral להצגת מידע נוסף

  8. 13:17

    סגירת הדיאלוג בלחיצה מחוץ לו

תמלול ההרצאה: Alert Dialog

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

  1. 00:02

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

  2. 00:21

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

  3. 00:34

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

  4. 00:48

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

  5. 01:07

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

  6. 01:20

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

  7. 01:31

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

  8. 01:48

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

  9. 02:00

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

  10. 02:15

    אז בואו ניקח Button, נגדיר כאן text size, נגדיר text all caps false, נגדיר text delete product ונגדיר onclick button delete product onclick.

  11. 02:39

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

  12. 03:00

    אז איך אנחנו עובדים עם אלרט דיאלוג? אז קודם כל אנחנו פותחים אובייקט בטיפוס alert dialog. בואו נגדיר alert dialog שווה new alert dialog.

  13. 03:15

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

  14. 03:39

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

  15. 03:48

    לדוגמה set message מהי ההודעה שאתה רוצה להציג delete this product סימן שאלה. דבר נוסף שאנחנו יכולים להציג זה איזושהי כותרת להודעה.

  16. 04:03

    לדוגמה set title confirm delete אנחנו יכולים להציג גם אייקון alertdialog.seticon כאן יש לנו בתיקיית ה-resources איזשהו אייקון שהכנתי של תמונת delete כזאת אז בואו פשוט ניתן את r drawable delete והנה כבר עכשיו יש לנו איזושהי הודעה שמוצגת עם אייקון עם כותרת ועם הודעה ספציפית הדבר הבא שאנחנו צריכים לעשות זה

  17. 04:38

    alertdialog.show רק רק פונקציית show בעצם מציגה את תיבת הדו שיח הזאת בואו נריץ את האפליקציה בואו נלחץ על לחצן ה delete product ושימו לב שכל המסך הפך להיות שחור ואנחנו רואים רק את ההודעה שאנחנו מציגים מה שאנחנו רואים כרגע זה הדיאלוג הנה האייקון הנה הכותרת הנה ההודעה עצמה והשאלה

  18. 05:11

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

  19. 05:45

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

  20. 06:06

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

  21. 06:28

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

  22. 06:37

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

  23. 06:54

    אז אם שאלנו שאלה, מן הסתם זה יכול להיות yes או no. והדבר השלישי שאנחנו רואים כאן, בואו ניקח את ההעמסה הזאת, זה on-click listener.

  24. 07:06

    הנה יש לנו כאן עוד פעם את מנגנון ה-listener pattern שאומר לנו, אתם רוצים שאני אבצע פעולה מסוימת כאשר היוזר לוחץ על הלחצן הזה, אחלה, אז תנו לי כאן אובייקט שמממש את on-click listener, ואני כבר אדאג לזה שאני

  25. 07:29

    אקרא לפונקציה שנמצאת בתוך האובייקט הזה ושהגיעה מהאינטרפייס on-click listener במידה והיוזר ילחץ על הלחצן הספציפי הזה.

  26. 07:40

    אז בואו נשתמש בשיטה של ה-current-plus, כלומר אנחנו אומרים this, הנה המחלקה Main Activity מממשת את on-click listener, שזה לא נכון כרגע.

  27. 07:54

    מחלקה Main Activity לא מממשת את on-click listener, אז כל מה שאנחנו צריכים לעשות זה לגרום למיין אקטיביטי לממש את on-click listener.

  28. 08:03

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

  29. 08:24

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

  30. 09:01

    שאנחנו מממשים כאילו את האינטרפס. אז בואו עכשיו נלחץ עוד פעם על Alt Enter ונבחר Implement Methods ויש לנו רק פונקציה אחת onClick.

  31. 09:13

    הפונקציה הזאת מתבצעת במידה והכפתור הזה נלחץ. מה אנחנו רוצים לעשות ב-onClick? אז בואו נציג פה כרגע איזשהו טוסט. make text this.seek product as being deleted.

  32. 09:36

    נתיר פה length long בצורה כזאת והנה יש לנו עכשיו לחצן אחד בואו נבדוק את זה בואו נלחץ על delete product והנה אנחנו מקבלים yes נלחץ על yes ונראה שהפונקציה שכתבנו התבצעה ואנחנו מקבלים את ההודעה כמובן במציאות אנחנו מוחקים את המוצר במקרה הזה אבל זה קצת מוזר אנחנו שואלים פה שאלה ונותנים רק אופציה ל-yes בואו נוסיף עוד לחצן הלחצן הבא יהיה

  33. 10:09

    עבור no על ידי ctrl d והפעם נבחר בבטון נגטיב נרשום no אנחנו לא רוצים למחוק את המוצר ונגרום לאותה הפונקציה להתבצע אבל כאן אנחנו צריכים עכשיו להפריד את ההודעה הזאת ולהגיד רגע אנחנו לא תמיד רוצים לבצע מחיקה אולי המשתמש לחץ על no אז כאן אנחנו מקבלים וויצ' שזה בעצם איזה לחצן לחצו עליו.

  34. 10:45

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

  35. 11:13

    במידה והוא לחצן נגטיב, נעתיק נדביק, אז אנחנו רוצים להגדיר that a product has not been deleted. נבדוק.

  36. 11:31

    נלחץ על delete product, הפעם אנחנו רואים שני לחצנים. yes גורם לאותה הודעה של מקודם, product has been deleted. נגדיר שוב את הדיאלוג no, product has not been deleted.

  37. 11:50

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

  38. 12:09

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

  39. 12:27

    בואו נשכפל את זה, נדביק, ניקח את הקבוע הזה, נדביק פה ונרשום deleted product can't be undone. זאת אומרת אנחנו אומרים למשתמש, תקשיב, אם אתה מוחק את המוצר הזה אי אפשר לחזור בחזרה.

  40. 12:49

    בואו נריץ, בואו נלחץ על delete product וכאן בצד אנחנו רואים את ה-more info. לוחצים על ה-more info והנה יש לנו דבר שלישי שאנחנו יכולים לעשות.

  41. 13:02

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

  42. 13:38

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

לקורס המלא: קורס פיתוח אפליקציות לאנדרואיד

ההרצאה הקודמת: Dynamic Menu

ההרצאה הבאה: List Dialog

הרצאות קשורות מקורסים אחרים

  • Switch to JS Alert
  • Billing Budget Alert
  • הוספת אנימציה ל-Dialog
  • תיבות דו-שיח - Build-In Dialog Boxes

קורסים נוספים במסלול

  • קורס יסודות התכנות - שפת JAVA - קורס ג'אווה למתחילים
  • קורס פיתוח אפליקציות - לאייפון iPhone iOS - ב-Swift-Xcode
  • קורס פלאטר - Flutter - שפת DART של גוגל למובייל - פיתוח אפליקציות לאנדרואיד ואייפון
  • קורס PhoneGap - פיתוח אפליקציות לאנדרואיד ואייפון