תכנות מכוון עצמים בשפת JAVA הרצאה 06 – חלק א' GUI בסיסי © Keren Kalif

ביחידה זו נלמד: AWT לעומת SWING Look & Feel תכנון היררכי של ה- GUI הגדרות של JFrame הרצת Swing ב- Thread נפרד הצגת Icon הפקד JComboBox Layout הצגת נתונים בטבלה

דוגמא בסיסית של GUI באמצעות AWT יש לרשת מהמחלקה Frame כדי שהתוכנית תיפתח בחלון כב"מ, ה- Frame אינו מגיב ללחיצה על ה- X, ולכן צריך להוסיף אירוע (פירוט בהמשך) יש להגדיר כיצד יסודרו הרכיבים בחלון (פירוט בהמשך) הוספת 2 פקדי Label ופקד Button כב"מ Frame אינו מוצג למסך, לכן צריך להפעיל את setVisible. לכל שאר הפקדים הערך true הוא ב"מ.

היסטוריה (1) GUI הינו ממשק משתמש גרפי: Graphic User Interface בעבר בשפת JAVA עבדו עם מנגנון ה- AWT (Abstract Window Toolkit) מנגנון זה היה תלוי במערכת ההפעלה, ולכן הרצת התוכנית נראתה באופן שונה על מערכות הפעלה שונות ה- JVM ביקש ממערכת ההפעלה לבצע את הציור בפועל (הפקדים), ומכאן נבע השוני בהופעה למסך בגלל הפניות הרבות למערכת ההפעלה, שלמעשה הינן יציאה ממסגרת ה- JVM, השימוש במנגנון כבד בגלל השוני בין מערכות ההפעלה השונות, לא ניתן לבצע קוסטומיזציה למשל: אם ב- windows ניתן להציג תמונה על כפתור ובלינוקס לא, זה בעייתי

היסטוריה (2) בגירסא 1.2 של JAVA יצא ה- SWING, העובד באופן שונה מאשר AWT: ב- swing שכתבו חלק מהקומפוננטות (רכיבים) של AWT, ושמן יהיה זהה פרט לכך שיתחילו ב- J למשל: Jframe במקום Frame. ההבדל המהותי בין AWT ל- SWING הוא ש- SWING מציירת בעצמה את הרכיבים ולא מערכת ההפעלה. כלומר, swing יודע עפ"י מערכת ההפעלה שעליה הוא רץ כיצד להציג את הרכיב. יתרונות: התוכנית יותר קלה ומהירה כי אין פניות רבות למ"ה ניתן לבצע קוסטימיזציה בקלות כי אין תלות במ"ה (ה- swing יודע לצייר את הרכיב ולא מתבסס על מ"ה, בניגוד ל- AWT

דוגמא בסיסית של GUI באמצעות SWING הפעם יש לרשת מהמחלקה JFrame כב"מ, ה- JFrame אינו מגיב ללחיצה על ה- X, אבל יש פקודה מובנית להגבת האירוע שמות הפקדים מתחילים ב- J

התצוגה ב- AWT לעומת SWING

לא ניתן להוסיף פקד פעמיים

שינוי התצוגה באפליקציית swing תצוגת Windows משמע להתאים את גודל החלון לגודל הרכיבים בעקבות שינוי התצורה כך יראה בלי theFrame.pack

ערכים שונים ל- L&F UIManager.setLookAndFeel("com.sun.java.swing.plaf.motif.MotifLookAndFeel"); UIManager.setLookAndFeel("com.sun.java.swing.plaf.gtk.GTKLookAndFeel"); UIManager.setLookAndFeel("com.sun.java.swing.plaf.windows.WindowsLookAndFeel"); UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName()); יקח את הגדרות מערכת ההפעלה, Windows במקרה שלי UIManager.setLookAndFeel(UIManager.getCrossPlatformLookAndFeelClassName()); וזוהי אופציית ב"מ

במקום חלון. מאפשר לפתוח JAVA בדפדפן. כבר לא בשימוש. קומפוננטות ב- SWING מתחלקות ל- 3 סוגים: JComponent: הרכיבים הבסיסים שניתן להציג. למשל: JLabel, JText, JButton. יש כ- 35 רכיבים שכאלו. Container: רכיב שיכול להכיל בתוכו רכיבים אחרים, סוג של לוח ציור. JPanel, JTabbedPane, JSplitPane, JScrollPane Top Level Container: יש רק אחד כזה באפליקציה והוא למעשה החלון של התוכנית, ה- Conatiner הראשי. יכול להיות אחד מהבאים: JFrame, JDialog, JApplet, JWindow הכי פופלארי Pop Up במקום חלון. מאפשר לפתוח JAVA בדפדפן. כבר לא בשימוש.

היררכיה נכונה ביצירת אפליקציה למשל JFrame, JDialog למשל Jbutton, JLabel JFrame JPanel JLabel JTextBox JButton למשל JPanel הרכיב הראשי מציג ברקורסיה את כל הרכיבים שתחתיו

דוגמא לאפליקציה פשוטה יצירת Panel עם מסגרת וכותרת יצירת כל הפקדים על panel ולא ישירות על ה- Frame לכל container צריך לתת גודל, אחרת גודלו הוא 0

הוספת פקדים ל- Content Pane גם דרך ה- JFrame הוספת הפקד ל- panel ולא ל- frame

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

הגדרת גודל של Frame ביחס גודל המסך

הגדרת מיקום פתיחת החלון כב"מ, החלון נפתח בפינה העליונה השמאלית. ניתן לשנות הגדרה זו באמצעות השיטה setBounds: במקום setBounds ניתן להשתמש ב- setSize וב- setLocation בנפרד

במקום null ניתן לתת חלון אחר של התוכנית, ואז חלון זה יפתח במרכזו. פתיחת החלון במרכז המסך במקום null ניתן לתת חלון אחר של התוכנית, ואז חלון זה יפתח במרכזו.

קישורים להסברים על הפקדים השונים http://download.oracle.com/javase/tutorial/ui/features/co mpWin.html בלינק הבא יש דוגמאות לקוד המשתמש ב- SWING: פלט + source code (לא זמין באופן זמני?) http://java.sun.com/products/jfc/jws/SwingSet2.jnlp

הפעלת ה- swing ב- thread נפרד כלומר, שאם קורה אירוע בזמן ציור ה- GUI, התוכנית לא "תתקע" Thread זה נקרא Event Dispatch Thread (EDT) באפליקציות גדולות, thread'ים אחרים ירצו לעדכן את ה- GUI, וכדי למנוע "תקיעות" וכדי שהעבודה תיעשה במקביל

הפעלת ה- swing ב- thread נפרד - הקוד

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

הצגת תמונה (2)

הפקד ComboBox

יסודרו ברצף אחד ליד השני. שינוי גודל החלון יארגן אותם מחדש. Layout Manager נכתוב תוכנית המוסיפה 10 רכיבים לחלון. כיצד הם יסודרו? יסודרו ברצף אחד ליד השני. שינוי גודל החלון יארגן אותם מחדש.

FlowLayout כב"מ JAVA מסדרת לנו את הרכיבים ב- FlowLayout כלומר, סידור הרכיבים אחד ליד השני ומעבר לשורה הבאה כאשר נגמר המקום אלא אם נתנו מיקום מדויק לרכיב מתן מיקום מדויק אינו טוב, מאחר וכבר לא תהייה פרופורציה כאשר נשנה את גודל החלון JAVA מספקת לנו כל מיני אלגוריתמי סידור (Layout), והם גם יודעים לחשב את הפרופרציות עם שינוי גודל החלון בשימוש ב- Layout ניתן לקבוע את המרחק בין הרכיבים השונים

סקירת Layout לקוח מתוך http://www.docstoc.com/docs/33446046/Java-Swing

BorderLayout מאפשר סידור רכיבים בצורת מסגרת. כב"מ שם את הפקד בתוך החלק של ה- CENTER, ולכן בדוגמא זו רואים רק את הפקד האחרון:

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

BoxLayout – סידור הרכיבים בשורה או בעמודה בניגוד ל- FlowLayout, הרכיבים לא יעברו לשורה הבאה.

Spring Layout - סידור רכיבים במיקום יחסי ה- west של ה- label יהיה במרחק 50 פיקסלים מה- west של ה- panel ה- west של ה- textFieldיהיה במרחק 5 פיקסלים מה- east של ה- label

Layout נוספים CardLayout: הצגת רכיב אחד כל פעם, אחד מעל השני GridLayout: מגדיר טבלה. יש לספק כמות שורות וכמות עמודות. אם כמות השורות היא 0, אז מסתמך על כמות העמודות, והפוך כל הגדלים של התאים זהים הוספת רכיבים היא לפי הסדר, לא ניתן לדלג על תאים ComplexLayout: כאשר layout אחד מכיל layout אחר באחד הרכיבים שלו כאשר הראשי עושה resize, זה משפיע גם על הפנימיים מדריך מצויין ל- layout'ים: http://download.oracle.com/javase/tutorial/uiswing/layout /visual.html

דוגמא לעבודה עם טבלה בעבודה עם טבלה יש אובייקט שנקרא AbstractTableModel המחזיק את המידע שבטבלה המחלקה המובנית DefaultTableModel מהווה מימוש למחלקה אבסטרקטית זו: הדוגמא JTableWithDefaultTabelModelExample ניתן לרשת מממשק זה: הדוגמא JTableWithAbstractTabelModelExample

תרגיל 1 יצרו את החלון הבא שמכיל שם, חיה אהובה (כלב, חתול, סוס או דג), האם נקבה וכפתור לבצגת הנתונים:

תרגיל 2 הגדירו את המחלקה מזון עם הנתונים הבאים: שם המזון, מספר קלוריות ל- 100ג' ומחיר. צרו חלון ובו טבלה המציגה 3 סוגים של מאכלים יש להשתמש ב- AbstractTableModel

ביחידה זו למדנו: AWT לעומת SWING Look & Feel תכנון היררכי של ה- GUI הגדרות של JFrame הרצת Swing ב- Thread נפרד הצגת Icon הפקד JComboBox Layout הצגת נתונים בטבלה