שימוש בשיעור גרפיקה

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

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

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

נתחיל בשלב המרכזי - Graphicsהשיעור.

חוג הגרפיקה

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

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

השיטות

שלוש השיטות הבאות מעורבות בהצגת גרפיקה. גרסאות ברירת מחדל של כל אחת מהן מסופקות לפי מחלקות Component. שיטות עדכון () ו צבע () יש להגדיר מחדש כדי לבצע את פעולות גרפיקה רצוי.

לצבוע מחדש()

צביעה מחודשת של חלל ציבורי () צביעה חוזרת של חלל ציבורי (ארוך tm) צביעה מחודשת של חלל ציבורי (int x, int y, int w, int h) צביעת חלל ציבורית נוספת (long tm, int x, int y, int w, int h)

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

עכבר בוליאני (אירוע e, int x, int y) {selected_object.move (x, y); לצבוע מחדש(); }

רישום 1: מטפל באירועים בעכבר העכבר

הקוד במטפל האירועים mouseDown () מחשב מחדש את המיקום של אובייקט בתצוגה בהתבסס על מיקום העכבר וקורא לשיטת הצביעה מחדש () כדי לציין שיש לצבוע מחדש את התצוגה בהקדם האפשרי.

עדכון()

עדכון חלל ציבורי (גרפיקה ז)

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

צֶבַע()

צבע חלל ציבורי (גרפיקה ז)
שיטת הצבע () נקראת משיטת update () והיא אחראית על ציור הגרפיקה בפועל. הטיעון היחיד של השיטה הוא מופע של Graphicsהמעמד. יישום ברירת המחדל המסופק על ידי המחלקה Componentאינו עושה דבר.

כיצד נצבעים רכיבים מחדש

כדי להפחית את הזמן הדרוש לצביעה מחדש של התצוגה, ה- AWT לוקח שני קיצורי דרך:

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


    
  • שנית, אם רכיב היה מכוסה ונחשף, ה- AWT צובע מחדש רק את החלק של הרכיב שהיה מכוסה בעבר.

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

איור 1: צבוע מחדש את הדפדפן

מערכת הקואורדינטות הגרפיקה

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

מערכת קואורדינטות היא שיטה לציון חד משמעי של מיקום הנקודות בחלל. במקרה של ה- AWT, חלל זה הוא משטח דו מימדי הנקרא מישור. ניתן לציין כל מיקום במישור על ידי שני מספרים שלמים, הנקראים קואורדינטות x ו- y . ערכי הקואורדינטות x ו- y מחושבים במונחים של תזוזה אופקית ואנכית של הנקודה מהמקור. במקרה של ה- AWT, המקור הוא תמיד הנקודה בפינה השמאלית העליונה של המטוס. יש לו את ערכי הקואורדינטות 0 (עבור x ) ו- 0 (עבור y). האיור באיור 2 מציג שתי נקודות - אחת ממוקמת במקור, ואחת ממוקמת במיקום שבע לרוחב וחמש למטה מהמקור.

איור 2: מישור הקואורדינטות

פרימיטיבי הגרפיקה

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

שורות

void drawLine (int xBegin, int yBegin, int xEnd, int yEnd)

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

היישומון באיור 3 מדגים את שיטת drawLine () בפעולה. קוד המקור זמין כאן. יישומון זה והיישומונים באיורים 4, 6 ו -7 דורשים שירותים של שתי מחלקות תמיכה: מחלקת NewCanvas וממשק איור. הכיתה NewCanvas מרחיבה את Canvas Canvas, ומספקת משטח ציור מיוחד לדמויות. קוד המקור למחלקת NewCanvas זמין כאן. ממשק האיור מגדיר את השיטות שעל הדמות לספק כדי להשתמש בהן עם NewCanvas. קוד המקור לממשק איור זמין כאן.

איור 3: הדגמת שרטוט קו

מלבנים
חלל drawRect (int x, int y, int w, int h) ריק ריק (int x, int y, int w, int h) חלל drawRoundRect (int x, int y, int w, int h, int arc רוחב, int arc גובה ) void fillRoundRect (int x, int y, int w, int h, int arcWidth, int arcHeight) void draw3DRect (int x, int y, int w, int h, בוליאני מורם) ריק ריק 3DRect (int x, int y, int w, int h, בוליאני מורם)

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

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

היישומון באיור 4 מדגים שיטות אלה בפעולה. קוד המקור זמין כאן.

איור 4: הדגמת ציור מלבן

אליפסות וקשתות

חלל drawOval (int x, int y, int w, int h) void fillOval (int x, int y, int w, int h) חלל drawArc (int x, int y, int w, int h, int start זווית, int arc זווית ) בטל fillArc (int x, int y, int w, int h, int startAngle, int arcAngle)

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

The arc graphics methods require two additional parameters, a start angle and an arc angle, to specify the beginning of the arc and the size of the arc in degrees (not radians). Figure 5 illustrates how angles are specified.

Figure 5: Angle specification

The applet in Figure 6 demonstrates these methods in action. The source code is available here.

Figure 6: Oval and arc drawing demonstration

polygons

void drawPolygon(int xPoints[], int yPoints[], int nPoints) void drawPolygon(Polygon p) void fillPolygon(int xPoints[], int yPoints[], int nPoints) void fillPolygon(Polygon p)

Polygons are shapes formed from a sequence of line segments. Each of the polygon graphics methods require, as parameters, the coordinates of the endpoints of the line segments that make up the polygon. These endpoints can be specified in either one of two ways: as two parallel arrays of integers, one representing the successive x coordinates and the other representing the successive y coordinates; or with an instance of the Polygon class. The Polygon class provides the method addPoint(), which allows a polygon definition to be assembled point by point. The resulting shape will be clipped to fit within the boundaries of the current clipping region.

The applet in Figure 7 demonstrates these methods in action. The source code is available here.

איור 7: הדגמת ציור מצולע

סיכום

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

המשך לעקוב.

טוד סונדסטד כותב תוכניות מאז שהמחשבים זמינים במודלים שולחניים. אף על פי שבמקור היה מעוניין לבנות יישומי אובייקטים מבוזרים ב- C ++, עבר טוד לשפת התכנות של ג'אווה כאשר ג'אווה הפכה לבחירה המתבקשת לסוג כזה. בנוסף לכתיבה, טוד מספק שירותי ייעוץ אינטרנט ורשת לחברות בדרום מזרח ארצות הברית. : END_BIO

למידע נוסף על נושא זה

  • Graphicsממשק ה- API של Java Class

    //java.sun.com/products/JDK/CurrentRelease/api/java.awt.Graphics.html

  • צופה ונצפה //www.sun.com/javaworld/jw-10-1996/jw-10-howto.html
  • ממשק המשתמש היעיל //www.sun.com/javaworld/jw-09-1996/jw-09-userint.html
  • ג'אווה וטיפול באירועים //www.sun.com/javaworld/jw-08-1996/jw-08-event.html
  • מבוא ל- AWT //www.sun.com/javaworld/jw-07-1996/jw-07-awt.html

סיפור זה, "שימוש בכיתת הגרפיקה" פורסם במקור בהוצאת JavaWorld.