王穎奇 20171010129《面向物件程式設計（java）》第十二週學習總結
實驗十二 圖形程式設計
理論：
10.1 AWT與Swing簡介
10.2 框架的建立
10.3 圖形程式設計
10.4 顯示影象
（具體學習總結在最後）
實驗：
實驗時間 2018-11-14
1、實驗目的與要求
(1) 掌握Java GUI中框架建立及屬性設定中常用類的API；
(2) 掌握Java GUI中2D圖形繪製常用類的API；
(3) 瞭解Java GUI中2D圖形中字型與顏色的設定方法；
(4) 瞭解Java GUI中2D影象的載入方法。
2、實驗內容和步驟
實驗1： 匯入第10章示例程式，測試程式並進行程式碼註釋。
測試程式1：
l 執行下列程式，觀察程式執行結果。
| import javax.swing.*; public class SimpleFrameTest { public static void main(String[] args) { JFrame frame = new JFrame(); frame.setBounds(0, 0,300, 200);//設定框架的初始位置和大小 frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//設定框架的關閉按鈕 frame.setVisible(true);//設定使用者是否能調整框架大小 } } |
測試結果：
l 在elipse IDE中除錯執行教材407頁程式10-1，結合程式執行結果理解程式；與上面程式對比，思考異同；
程式碼：
package simpleFrame; import java.awt.*; import javax.swing.*; /** * @version 1.33 2015-05-12 * @author Cay Horstmann */ public class SimpleFrameTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { SimpleFrame frame = new SimpleFrame(); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } class SimpleFrame extends JFrame { private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public SimpleFrame() { setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT); } }SimpleFrameTest
執行結果：
兩個程式的異同點：
相同點：
1.生成的框架（frame）大小和初始位置相同
2.生成的框架均可以由使用者改變大小（setResizable方法）
3.均設定了setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE)方法以關閉框架
不同點：
示例1：
使用setBounds方法設定框架大小
p407 10-1：
使用繼承的方法（用lambda表示式簡化）設定框架大小
l 掌握空框架建立方法；
l 瞭解主執行緒與事件分派執行緒概念；
l 掌握GUI頂層視窗建立技術。
測試程式2：
l 在elipse IDE中除錯執行教材412頁程式10-2，結合程式執行結果理解程式；
l 掌握確定框架常用屬性的設定方法。
框架的圖示發生變化
程式碼：
package sizedFrame; import java.awt.*; import javax.swing.*; /** * @version 1.34 2015-06-16 * @author Cay Horstmann */ public class SizedFrameTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new SizedFrame(); frame.setTitle("SizedFrame"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } class SizedFrame extends JFrame { public SizedFrame() { // 獲得Dimension的大小 Toolkit kit = Toolkit.getDefaultToolkit(); Dimension screenSize = kit.getScreenSize(); int screenHeight = screenSize.height; int screenWidth = screenSize.width; // 確定框架的大小，以及在螢幕上的位置 setSize(screenWidth / 2, screenHeight / 2); setLocationByPlatform(true); // 將影象設定為框架的圖示 Image img = new ImageIcon("icon.gif").getImage(); setIconImage(img); } }SizedFrameTest
執行結果：
測試程式3：
l 在elipse IDE中除錯執行教材418頁程式10-3，結合執行結果理解程式；
l 掌握在框架中新增元件；
l 掌握自定義元件的用法。
程式碼：
package notHelloWorld; import javax.swing.*; import java.awt.*; /** * @version 1.33 2015-05-12 * @author Cay Horstmann */ public class NotHelloWorld { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new NotHelloWorldFrame(); frame.setTitle("NotHelloWorld"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } /** * A frame that contains a message panel */ class NotHelloWorldFrame extends JFrame { public NotHelloWorldFrame() { add(new NotHelloWorldComponent()); pack(); } } /** * A component that displays a message. */ class NotHelloWorldComponent extends JComponent { public static final int MESSAGE_X = 75; public static final int MESSAGE_Y = 100; private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public void paintComponent(Graphics g) { g.drawString("Not a Hello, World program", MESSAGE_X, MESSAGE_Y); } public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); } }NotHelloWorld
執行結果：
測試程式4：
l 在elipse IDE中除錯執行教材424 -425頁程式10-4，結合程式執行結果理解程式；
l 掌握2D圖形的繪製方法。
程式碼：
package draw; import java.awt.*; import java.awt.geom.*; import javax.swing.*; /** * @version 1.33 2007-05-12 * @author Cay Horstmann */ public class DrawTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new DrawFrame(); frame.setTitle("DrawTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } /** * A frame that contains a panel with drawings */ class DrawFrame extends JFrame { public DrawFrame() { add(new DrawComponent()); pack(); } } /** * A component that displays rectangles and ellipses. */ class DrawComponent extends JComponent { private static final int DEFAULT_WIDTH = 400; private static final int DEFAULT_HEIGHT = 400; public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D) g; // draw a rectangle double leftX = 100; double topY = 100; double width = 200; double height = 150; Rectangle2D rect = new Rectangle2D.Double(leftX, topY, width, height); g2.draw(rect); // draw the enclosed ellipse Ellipse2D ellipse = new Ellipse2D.Double(); ellipse.setFrame(rect); g2.draw(ellipse); // draw a diagonal line g2.draw(new Line2D.Double(leftX, topY, leftX + width, topY + height)); // draw a circle with the same center double centerX = rect.getCenterX(); double centerY = rect.getCenterY(); double radius = 150; Ellipse2D circle = new Ellipse2D.Double(); circle.setFrameFromCenter(centerX, centerY, centerX + radius, centerY + radius); g2.draw(circle); } public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); } }DrawTest
執行結果：
測試程式5：
l 在elipse IDE中除錯執行教材432頁-433程式10-5，結合程式執行結果理解程式；
本程式中的“Hello，World！”是圖形，不是文字，無法拷貝
l 瞭解2D圖形中字型的設定的方法；
程式碼：
package font; import java.awt.*; import java.awt.font.*; import java.awt.geom.*; import javax.swing.*; /** * @version 1.34 2015-05-12 * @author Cay Horstmann */ public class FontTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new FontFrame(); frame.setTitle("FontTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } /** * A frame with a text message component */ class FontFrame extends JFrame { public FontFrame() { add(new FontComponent()); pack(); } } /** * A component that shows a centered message in a box. */ class FontComponent extends JComponent { private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D) g; String message = "Hello, World!"; Font f = new Font("Serif", Font.BOLD, 36); g2.setFont(f); // measure the size of the message FontRenderContext context = g2.getFontRenderContext(); Rectangle2D bounds = f.getStringBounds(message, context); // set (x,y) = top left corner of text double x = (getWidth() - bounds.getWidth()) / 2; double y = (getHeight() - bounds.getHeight()) / 2; // add ascent to y to reach the baseline double ascent = -bounds.getY(); double baseY = y + ascent; // draw the message g2.drawString(message, (int) x, (int) baseY); g2.setPaint(Color.LIGHT_GRAY); // draw the baseline g2.draw(new Line2D.Double(x, baseY, x + bounds.getWidth(), baseY)); // draw the enclosing rectangle Rectangle2D rect = new Rectangle2D.Double(x, y, bounds.getWidth(), bounds.getHeight()); g2.draw(rect); } public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); } }FontTest
執行結果：
測試程式6：
l 在elipse IDE中除錯執行教材436頁-437程式10-6，結合程式執行結果理解程式；
該程式中的gif影象會通過for循壞語句，在框架的長和寬上整齊排列，全部鋪滿
l 瞭解2D圖形影象的顯示方法。
程式碼：
package image; import java.awt.*; import javax.swing.*; /** * @version 1.34 2015-05-12 * @author Cay Horstmann */ public class ImageTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new ImageFrame(); frame.setTitle("ImageTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } } /** * A frame with an image component */ class ImageFrame extends JFrame { public ImageFrame() { add(new ImageComponent()); pack(); } } /** * A component that displays a tiled image */ class ImageComponent extends JComponent { private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; private Image image; public ImageComponent() { image = new ImageIcon("blue-ball.gif").getImage(); } public void paintComponent(Graphics g) { if (image == null) return; int imageWidth = image.getWidth(null); int imageHeight = image.getHeight(null); // draw the image in the upper-left corner g.drawImage(image, 0, 0, null); // tile the image across the component for (int i = 0; i * imageWidth <= getWidth(); i++) for (int j = 0; j * imageHeight <= getHeight(); j++) if (i + j > 0) g.copyArea(0, 0, imageWidth, imageHeight, i * imageWidth, j * imageHeight); } public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); } }ImageTest
執行結果：
實驗2：課後完成PTA平臺題目集：2018秋季西北師範大學面向物件程式設計（Java）練習題集（ch6-ch9)
練習題集中的混淆習題：
1.一個類可以實現多個介面。
2.一個介面可以繼承其他介面。
3.介面中的常量預設是public static的變數。->介面中的常量預設是public static final
4.介面中的方法預設都是靜態的。->介面中包含具有具體實現的方法，該方法稱為 “預設方法”，預設方法使用 default 關鍵字修飾。
5.在使用interface宣告一個介面時，只可以使用（public）修飾符修飾該介面。
6.用於定義介面的關鍵字是（ ）。 (2分)8.Java的集合框架中重要的介面java.util.Collection定義了許多方法。選項中哪個方法不是Collection介面所定義的？( ) (2分)
學習總結：
10.1 AWT與Swing簡介
使用者介面(User Interface)
– 使用者與計算機系統(各種程式)互動的介面
圖形使用者介面(Graphical User Interface)
– 以圖形方式呈現的使用者介面
AWT
Java 的 抽 象 窗 口 工 具 箱 （ Abstract WindowToolkit, AWT)包含在java.awt包中，它提供了許多用來設計GUI的元件類和容器類。
AWT庫處理使用者介面元素的方法：把圖形元素的建立和行為委託給本地GUI工具箱進行處理。
應用AWT編寫依賴於本地使用者介面元素GUI會暴露出一些缺陷。例如，選單、滾動條和文字域這些使用者介面元素，在不同的平臺上，操作行為上存在一些微妙的差異。
Swing
l Swing使用者介面庫是非基於對等體的GUI工具箱。
l Swing具有更豐富並且更方便的使用者介面元素集合。
l Swing對底層平臺的依賴很少，因此與平臺相關的bug很少。
l Swing會帶來交叉平臺上的統一視覺體驗。
l Swing類庫被放在javax.swing包裡。
AWT與Swing的關係
l 大部分AWT元件都有其Swing的等價元件。
l Swing元件的名字一般是在AWT元件名前面新增一個字母“J”，如：JButton,JFrame,JPanel等
10.2 框架的建立
1.元件
構成圖形使用者介面的元素，拿來即用
l 用圖形表示(能在螢幕上顯示，能和使用者進行互動)
– Button、Checkbox、Scrollbar、Choice、Frame
l 通常把由Component類的子類或間接子類建立的
物件稱為一元件
2.容器
l 容器是Java中能容納和排列元件的元件。
l 常用的容器是框架（Frame,JFrame)
3.新增元件
Container類提供了一個方法add(),用來在容器類元件物件中新增其他元件。
容器本身也是一個元件，可以把一個容器新增到另一個容器裡，
4.框架（Frame）
l 在Java中，常採用框架（Frame）建立初始介面，即GUI的頂層視窗
5.在元件中顯示資訊
（1）Jframe的結構，它由根面板、層級面板、玻璃面板和 內容面板
（content pane）四層面板構成。Swing程式設計師最關心的是內容面板，也稱為內容窗格。
Jframe的結構：
（2）在AWT中可呼叫add()方法把元件直接新增到AWT Frame中,在Swing中元件則新增到內容窗格里。
10.3 圖形程式設計
1 處理2D圖形
2 顏色的使用
3 字型的使
10.4 顯示影象
在Java應用程式中，一旦影象儲存在本地或因特網的某個位置上，就可以將它們直接讀入到java應用程式中。
個人感受：
通過本週的學習，我掌握了AWT與Swing的概念，以及具體它們內容。具體瞭解Swing庫中容器，元件和框架的的定義，深度學習了框架的具體使用方法。課後，我通過課本和查閱資料，大致學習了java中圖形程式設計和顯示影象的方法。
在第6到第9章的練習當中，我發現仍有許多不足，需要通過不斷的學習來改進，也需要我對知識進行反覆回顧。