Transcript Java מתקדם | swing

‫קורס ‪ Java‬מתקדם‬
‫‪swing‬‬
‫קרן כליף‬
‫‪ Java‬מתקדם |‬
‫‪2 | ©Keren Kalif | swing‬‬
‫ביחידה זו נלמד‪:‬‬
‫‪ ‬תכנון היררכי של ה‪GUI -‬‬
‫‪ ‬אירועים‬
‫‪Layout ‬‬
‫‪MVC ‬‬
‫‪ Java‬מתקדם |‬
‫‪3 | ©Keren Kalif | swing‬‬
‫קומפוננטות ב‪SWING -‬‬
‫‪ ‬מתחלקות ל‪ 3 -‬סוגים‪:‬‬
‫‪.1‬‬
‫‪ :JComponent‬הרכיבים הבסיסים שניתן להציג‪.‬‬
‫‪ o‬למשל‪ .JLabel, JText, JButton :‬יש כ‪ 35 -‬רכיבים שכאלו‪.‬‬
‫‪.2‬‬
‫‪ :Container‬רכיב שיכול להכיל בתוכו רכיבים אחרים‪ ,‬סוג של לוח ציור‪.‬‬
‫‪JPanel, JTabbedPane, JSplitPane, JScrollPane o‬‬
‫‪.3‬‬
‫‪ :Top Level Container‬יש רק אחד כזה באפליקציה והוא למעשה החלון של התוכנית‪ ,‬ה‪-‬‬
‫‪ Conatiner‬הראשי‪.‬‬
‫‪ o‬יכול להיות אחד מהבאים‪JFrame, JDialog, JApplet, JWindow :‬‬
‫במקום חלון‪ .‬מאפשר לפתוח ‪ JAVA‬בדפדפן‪.‬‬
‫כבר לא בשימוש‪.‬‬
‫הכי פופלארי‬
‫‪Pop Up‬‬
4 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
‫היררכיה נכונה ביצירת אפליקציה‬
JFrame, JDialog ‫למשל‬
JLabel ,Jbutton ‫למשל‬
JFrame
JPanel
JPanel
JPanel ‫למשל‬
JLabel
JPanel
JTextBox
‫הרכיב הראשי מציג ברקורסיה‬
‫את כל הרכיבים שתחתיו‬
JButton
‫‪ Java‬מתקדם |‬
‫‪5 | ©Keren Kalif | swing‬‬
‫לכל ‪ container‬צריך לתת גודל‪,‬‬
‫אחרת גודלו הוא ‪0‬‬
‫יצירת ‪ Panel‬עם מסגרת וכותרת‬
‫יצירת כל הפקדים על ‪panel‬‬
‫ולא ישירות על ה‪Frame -‬‬
6 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
JFrame -‫ גם דרך ה‬Content Pane -‫הוספת פקדים ל‬
-‫הוספת הפקד ל‬
panel -‫ולא ל‬frame
‫‪ Java‬מתקדם |‬
‫‪7 | ©Keren Kalif | swing‬‬
‫אירועים‬
‫‪ ‬נרצה לקשר את הפעולה על הפקד (למשל לחיצה על כפתור או בחירת ‪ )CheckBox‬לפעולה‬
‫כלשהי‬
‫‪ ‬כלומר‪ ,‬המתכנת אינו יודע מראש מה סדר הפעולות שיופעל‪ ,‬אבל הוא מכין אוסף פעולות שסדר‬
‫הפעלתן יקבע ע"י האירועים שיפעלו ע"י המשתמש‬
‫‪ Java‬מתקדם |‬
‫‪8 | ©Keren Kalif | swing‬‬
‫תזכורת‪ :‬מחלקה פנימית‬
‫המחלקה הפנימית יכולה לגעת בתכונות‬
‫ובשיטות של המלחקה החיצונית‬
‫יצירת אובייקט מהמחלקה הפנימית יהייה אך‬
‫ורק באמצעות אובייקט של המחלקה החיצונית‪,‬‬
‫מאחר והוא צריך גישה לאובייקט חיצוני ספציפי‬
‫‪ Java‬מתקדם |‬
‫‪9 | ©Keren Kalif | swing‬‬
‫האזנה לאירועים‬
‫‪ ‬לכל פקד יש אוסף של שיטות שכל אחת מאפשרת להאזין לאירועים מקבוצה מסויימת (למשל‬
‫פעולות עכבר‪ ,‬פעולות מקלדת וכד')‬
‫‪ ‬כאשר אנחנו מעבירים כפרמטר לשיטה ‪ new XXXListener‬אנחנו מעבירים אובייקט המממש את‬
‫הממשק המוגדר‪ ,‬ולכן עלינו לספק מימושים לכל המתודות המוגדרות‪ ,‬אפילו מימוש ריק‬
‫‪ ‬במקום להעביר ‪ new XXXListener‬ניתן להעביר ‪ new XXXAdapter‬שהיא מחלקה‬
‫המממשת את הממשק עם מימושים ריקים‪ ,‬וכך ניתן לספק מימוש רק לשיטות‬
‫שאנחנו בוחרים‬
‫‪ Java‬מתקדם |‬
‫‪10 | ©Keren Kalif | swing‬‬
‫האזנה לאירועים ע"י מימוש ממשק לעומת מימוש מחלקה‬
‫ממשק יסתיים ב‪ Listener -‬ויש חובה‬
‫לספק מימוש לכל המתודות‬
‫מחלקה תסתיים ב‪ Adapter -‬וניתן‬
‫לספק מימוש רק לחלק מהמתודות‬
‫‪ Java‬מתקדם |‬
‫‪11 | ©Keren Kalif | swing‬‬
‫האזנה לאירועים באמצעות ‪AbstractAction‬‬
‫‪ ‬יש מקרים בהם נרצה שכמה פקדים יגיבו בצורה זהה‪ ,‬בלי לשכפל את הקוד‪.‬‬
‫‪o‬‬
‫‪o‬‬
‫למשל‪ :‬תפריט‪ ,‬כפתור וכד'‬
‫גם הטקסט וגם הפעולה ‪ ActionPerformed‬תהייה זהה‬
‫‪ ‬ישנם פקדים שה‪ c’tor -‬שלהם מקבל אובייקט מהמחלקה ‪ AbstractAction‬המגדיר את‬
‫הטקסט שיוצג על הפקד ואת הפעולה שתבוצע באת לחיצה‪/‬בחירה‬
‫‪ Java‬מתקדם |‬
‫‪12 | ©Keren Kalif | swing‬‬
‫כמובן שבאפליקציה בה כל רכיב נמצא במחלקה אחרת‪ ,‬גם‬
‫המחלקה שלנו שיורשת מ‪ AbstractAction -‬תשב בקובץ נפרד‬
13 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
‫הדוגמא של שינוי התצוגה‬
‫ מקובץ הזיפ‬SimpleLookAndFeelExample ‫ הדוגמא‬
‫לינק עם הצגה של כל הפקדים‬
http://download.oracle.com/javase/tutorial/ui/features/compWin.html 
‫‪ Java‬מתקדם |‬
‫‪14 | ©Keren Kalif | swing‬‬
‫הפעלת ה‪ swing -‬ב‪ thread -‬נפרד‬
‫‪ ‬את ה‪ swing -‬גם נריץ ב‪ thread -‬נפרד כדי שנוכל להריץ את הלוגיקה שלנו במקביל בלי‬
‫תקיעויות‬
‫‪o‬‬
‫כלומר‪ ,‬שאם קורה אירוע בזמן ציור ה‪ ,GUI -‬התוכנית לא "תתקע"‬
‫‪ Thread ‬זה נקרא ‪)EDT( Event Dispatch Thread‬‬
‫‪ ‬באפליקציות גדולות‪'thread ,‬ים אחרים ירצו לעדכן את ה‪ ,GUI -‬וכדי למנוע "תקיעות" וכדי‬
‫שהעבודה תיעשה במקביל‬
15 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
‫ הקוד‬- ‫ נפרד‬thread -‫ ב‬swing -‫הפעלת ה‬
‫‪ Java‬מתקדם |‬
‫‪16 | ©Keren Kalif | swing‬‬
‫‪ Label‬עם תמונה‬
‫יש לשים לב שהמסלול הוא יחסי ביחס לתיקיית‬
‫ה‪ src -‬ולכן ישתנה מפרוייקט לפרוייקט‪ .‬כמובן‬
‫שניתן גם להעביר את המסלול כפרמטר‪.‬‬
‫מחלקה זו מספקת שיטה המקבלת את שם‬
‫קובץ ה‪ Icon -‬ומחזירה אותו כאובייקט‬
17 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
‫‪ Java‬מתקדם |‬
‫‪18 | ©Keren Kalif | swing‬‬
‫‪Layout Manager‬‬
‫‪ ‬נכתוב תוכנית המוסיפה ‪ 10‬רכיבים לחלון‪ .‬כיצד הם יסודרו?‬
‫יסודרו ברצף אחד ליד השני‪.‬‬
‫שינוי גודל החלון יארגן אותם מחדש‪.‬‬
‫‪ Java‬מתקדם |‬
‫‪19 | ©Keren Kalif | swing‬‬
‫‪FlowLayout‬‬
‫‪ ‬כב"מ ‪ JAVA‬מסדרת לנו את הרכיבים ב‪FlowLayout -‬‬
‫‪o‬‬
‫‪o‬‬
‫כלומר‪ ,‬סידור הרכיבים אחד ליד השני ומעבר לשורה הבאה כאשר נגמר המקום‬
‫אלא אם נתנו מיקום מדויק לרכיב‬
‫‪ ‬מתן מיקום מדויק אינו טוב‪ ,‬מאחר וכבר לא תהייה פרופורציה כאשר נשנה את גודל החלון‬
‫‪ JAVA ‬מספקת לנו כל מיני אלגוריתמי סידור (‪ ,)Layout‬והם גם יודעים לחשב את הפרופרציות‬
‫עם שינוי גודל החלון‬
‫‪ ‬בשימוש ב‪ Layout -‬ניתן לקבוע את המרחק בין הרכיבים השונים‬
20 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
Layout ‫סקירת‬
http://www.docstoc.com/docs/33446046/Java-Swing ‫ לקוח מתוך‬
‫‪ Java‬מתקדם |‬
‫‪21 | ©Keren Kalif | swing‬‬
‫‪BorderLayout‬‬
‫‪ ‬מאפשר סידור רכיבים בצורת מסגרת‪ .‬כב"מ שם את הפקד בתוך החלק של ה‪ ,CENTER -‬ולכן‬
‫בדוגמא זו רואים רק את הפקד האחרון‪:‬‬
‫‪ Java‬מתקדם |‬
‫‪22 | ©Keren Kalif | swing‬‬
‫‪ - BorderLayout‬הכיוונים‬
‫שינוי בגודל החלון משנה רק את גודל הרכיב המרכזי‪:‬‬
‫גובה הצפון והדרום נשארים קבועים‪ ,‬ורוחב המזרח‬
‫והמערב נשארים קבועים‪.‬‬
‫רק השטח של ה‪ CENTER -‬משתנה‪.‬‬
‫‪ Java‬מתקדם |‬
‫‪23 | ©Keren Kalif | swing‬‬
‫‪BoxLayout‬‬
‫– סידור הרכיבים בשורה או בעמודה‬
‫בניגוד ל‪,FlowLayout -‬‬
‫הרכיבים לא יעברו לשורה הבאה‪.‬‬
24 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
50 ‫ יהיה במרחק‬label -‫ של ה‬west -‫ה‬
panel -‫ של ה‬west -‫פיקסלים מה‬
‫ יהיה במרחק‬textField -‫ של ה‬west -‫ה‬
label -‫ של ה‬east -‫ פיקסלים מה‬5
‫‪ Java‬מתקדם |‬
‫‪25 | ©Keren Kalif | swing‬‬
‫‪ Layout‬נוספים‬
‫‪ :CardLayout ‬הצגת רכיב אחד כל פעם‪ ,‬אחד מעל השני‬
‫‪ :GridLayout ‬מגדיר טבלה‪ .‬יש לספק כמות שורות וכמות עמודות‪.‬‬
‫‪o‬‬
‫‪o‬‬
‫‪o‬‬
‫אם כמות השורות היא ‪ ,0‬אז מסתמך על כמות העמודות‪ ,‬והפוך‬
‫כל הגדלים של התאים זהים‬
‫הוספת רכיבים היא לפי הסדר‪ ,‬לא ניתן לדלג על תאים‬
‫‪ :ComplexLayout ‬כאשר ‪ layout‬אחד מכיל ‪ layout‬אחר באחד הרכיבים שלו‬
‫‪o‬‬
‫כאשר הראשי עושה ‪ ,resize‬זה משפיע גם על הפנימיים‬
‫‪ ‬מדריך מצויין ל‪'layout -‬ים‪:‬‬
‫‪http://download.oracle.com/javase/tutorial/uiswing/layout/visual.html‬‬
‫‪ Java‬מתקדם |‬
‫‪26 | ©Keren Kalif | swing‬‬
‫עדכון יזום של התצוגה‬
‫‪ – repaint ‬נפעיל אותה כאשר יש לצייר את ה‪ container -‬מחדש‪ ,‬לאחר הוספת‪/‬הסרת פקד‬
‫‪ – validate ‬גוררת סידור מחדש של הרכיבים ב‪ ,container -‬נפעיל לרוב על‬
‫‪ TopLevelContainer‬לאחר הוספה והסרה של פקד‪ .‬הפקודה תחלחל רקורסיבית לכל‬
‫הרכיבים המוכלים‪ .‬יגרור ‪ repaint‬במקרה הצורך‪.‬‬
‫‪ ‬לכן בהוספה ובהסרה נפעיל את ‪repaint+validate‬‬
‫‪ ‬הדוגמא‪RepaintAndValidateExample :‬‬
‫‪ Java‬מתקדם |‬
‫‪27 | ©Keren Kalif | swing‬‬
‫הדוגמא והתרגיל ‪ Survivors‬מהזיפ‪:‬‬
‫‪ ‬כבר קיים בדוגמא‪:‬‬
‫‪o‬‬
‫‪o‬‬
‫‪o‬‬
‫‪o‬‬
‫‪ JSplitPane‬בין שני השבטים‬
‫‪ JPanel‬לכל שבט ובתוכו ‪ JScrollPane‬להצגת השורדים‬
‫הוספת שורד לשבט באמצעות כפתור ובאמצעות תפריט‬
‫העברת שורדים משבט לשבט באמצעות כפתור ובאמצעות ‪double click‬‬
‫‪ ‬עליכם להוסיף‪:‬‬
‫‪o‬‬
‫‪o‬‬
‫‪o‬‬
‫‪o‬‬
‫‪ JPanel‬לאי המתים בתוך ‪JScrollPane‬‬
‫‪ JSplitPane‬בין החלק העליון של השבטים לאי המתים‬
‫העברת שורד לאי המתים באמצעות כפתור‬
‫מחיקת שורד מאי המתים‪ ,‬יהיה באמצעות דאבל קליק על השורד עם הודעת אישור‬
28 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
swing -‫דוגמאות לרכיבים ב‬
:swing ‫ קישורים לסקירת מדריכי רכיבי‬
http://docs.oracle.com/javase/tutorial/uiswing/components/componentlist.html
http://www.javamex.com/tutorials/swing/components.shtml
http://oreilly.com/catalog/learnjava/chapter/ch14.html
o
o
o
‫‪ Java‬מתקדם |‬
‫‪29 | ©Keren Kalif | swing‬‬
‫דוגמא לעבודה עם טבלה‬
‫‪ ‬בעבודה עם טבלה יש אובייקט שנקרא ‪ AbstractTableModel‬המחזיק את המידע שבטבלה‬
‫‪.1‬‬
‫הדוגמה ‪SimpleTableExample‬‬
‫‪.2‬‬
‫המחלקה המובנית ‪ DefaultTableModel‬מהווה מימוש למחלקה אבסטרקטית זו‪:‬‬
‫‪o‬‬
‫‪.3‬‬
‫הדוגמא ‪DefaultTabelModelExample‬‬
‫ניתן לרשת מממשק זה‪:‬‬
‫‪o‬‬
‫הדוגמא ‪AbstractTabelModelExample‬‬
‫‪ Java‬מתקדם |‬
‫‪30 | ©Keren Kalif | swing‬‬
‫הפרדה בין ה‪ BL -‬ל‪GUI -‬‬
‫‪ ‬בתכנות נכון יש להפריד בין הלוגיקה (שכבת ה‪ )Bussiness Logic -‬לעומת התצוגה (שכבת ה‪-‬‬
‫‪.)UI‬‬
‫‪ ‬הסיבה היא שה‪ UI -‬הוא דרך להצגת המידע‪ ,‬ואת הלוגיקה ניתן להציג בדרכים שונות‪ ,‬ללא‬
‫שיכפול של קוד הלוגיקה‪.‬‬
‫‪ ‬בפרוייקט גדול‪ ,‬יש צוות יעודי ללוגיקה וצות יעודי לממשק המשתמש ויש הפרדה ברורה‪.‬‬
‫‪ ‬לכן לא נשים הודעות שגיאה‪/‬לוגים המדפיסים למסך בקוד שלנו‪ ,‬אלא נשתמש במנגנון החריגות‬
‫כדי ליידע על בעיות‪.‬‬
‫‪ Java‬מתקדם |‬
‫‪31 | ©Keren Kalif | swing‬‬
‫‪MVC – Model-View-Controller‬‬
‫‪ ‬מנגנון ההפרדה נקרא ‪MVC‬‬
‫‪ ‬ה‪ Model -‬מכיל את המידע‪ ,‬לא מעניין אותו כיצד יראה המידע‬
‫‪ ‬ה‪ View -‬מתעניין רק בתצוגה‪ ,‬לא מעניין אותו כיצד המידע נשמר‬
‫‪ ‬תפקיד ה‪ Controller -‬הוא לקשר בין ‪ 2‬השכבות‬
‫‪2‬‬
‫‪4‬‬
‫‪1‬‬
‫‪3‬‬
‫התמונה לקוחה מ‪http://www.oracle.com/technetwork/articles/javase/index-142890.html :‬‬
32 | ©Keren Kalif | swing
| ‫ מתקדם‬Java
MVC – Model-View-Controller
‫ יהיה באמצעות אירועים‬View -‫ ל‬Model -‫ העדכון בין ה‬
‫ שיודיע לכל המאזינים עם כל עדכון‬listener ‫ יהיה‬View -‫ ול‬Model -‫ ל‬
:‫סגנונות המקובלים לשיטה זו‬
fireXXXChanged
fireXXXEvent
‫ הזיפ‬MVCBusExample.simple ‫הדוגמא‬
•
•
o
‫‪ Java‬מתקדם |‬
‫‪33 | ©Keren Kalif | swing‬‬
‫‪Renderer‬‬
‫‪ ‬משמש כ‪ controller -‬המובנה בשפה‬
‫‪ ‬תפקידו לקשר בין אובייקט מה‪ BL -‬ל‪ UI -‬וכן להציגו‬
‫‪ DefaultListCellRenderer ‬הוא סוג של ‪ JLabel‬וישנם ‪'renderer‬ים נוספים‪ ,‬למשל טבלה‬
‫‪ ‬יש לדרוס את השיטה ‪ getListCellRendererComponent‬אשר קובעת כיצד תראה תצוגת‬
‫האובייקט‬
‫הדוגמא ‪ MVCBusExample.renderer‬הזיפ‬
‫‪ Java‬מתקדם |‬
‫‪34 | ©Keren Kalif | swing‬‬
‫עורך ‪GUI‬‬
‫‪ ‬ניתן להוריד ‪ plug-in‬לאקליפס המאפשר יצירת ‪ GUI‬בצורת ‪Drag & Drop‬‬
‫‪ ‬בסביבת העבודה של ה‪ NetBeans -‬כבר יש תשתית ‪ built-in‬לכך‬
‫‪ ‬יש לשים לב‪ ,‬שאם יוצרים ‪ GUI‬באמצעות ‪ drag&drop‬ברוב התוכנות מתווסף קוד שלא יעבוד‬
‫בסביבה אחרת‬
‫‪ Java‬מתקדם |‬
‫‪35 | ©Keren Kalif | swing‬‬
‫ביחידה זו למדנו‪:‬‬
‫‪ ‬תכנון היררכי של ה‪GUI -‬‬
‫‪ ‬אירועים‬
‫‪Layout ‬‬
‫‪MVC ‬‬