201771010121 唐月晨 實驗十三 圖形介面事件處理技術
阿新 • • 發佈：2018-11-25
實驗十三 圖形介面事件處理技術
實驗時間 2018-11-22
1、實驗目的與要求
(1) 掌握事件處理的基本原理，理解其用途；
(2) 掌握AWT事件模型的工作機制；
(3) 掌握事件處理的基本程式設計模型；
(4) 瞭解GUI介面元件觀感設定方法；
(5) 掌握WindowAdapter類、AbstractAction類的用法；
(6) 掌握GUI程式中滑鼠事件處理技術。
2、實驗內容和步驟
實驗1：
測試程式1：
l 在elipse IDE中除錯執行教材443頁-444頁程式11-1，結合程式執行結果理解程式；
l 在事件處理相關程式碼處添加註釋；
l 用lambda表示式簡化程式；
l 掌握JButton元件的基本API；
l 掌握Java中事件處理的基本程式設計模型。
package button; import java.awt.*; import java.awt.event.*; import javax.swing.*;ButtonFrame/** * A frame with a button panel */ public class ButtonFrame extends JFrame { private JPanel buttonPanel; //設定框架的長寬 private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public ButtonFrame() { setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);/*//生成按鈕物件 JButton yellowButton = new JButton("Yellow"); JButton blueButton = new JButton("Blue"); JButton redButton = new JButton("Red");*/ buttonPanel = new JPanel();//建立JPanel內容物件 /* //add方法將三個按鈕元件新增到面板上去 buttonPanel.add(yellowButton); buttonPanel.add(blueButton); buttonPanel.add(redButton); */ // add panel to frame add(buttonPanel);//把按鈕新增到框架裡 //生成三個監聽器類物件；顏色值在Color類裡都是靜態常熟值 /* ColorAction yellowAction = new ColorAction(Color.YELLOW); ColorAction blueAction = new ColorAction(Color.BLUE); ColorAction redAction = new ColorAction(Color.RED);*/ //監聽器物件和元件之間的註冊機制；只有註冊了監聽器類物件的元件才是事件源。 /* yellowButton.addActionListener(yellowAction); blueButton.addActionListener(blueAction); redButton.addActionListener(redAction); */ makeButton("black",Color.black); makeButton("white",Color.white); makeButton("pink",Color.pink); makeButton("gray",Color.gray); } /** * An action listener that sets the panel's background color. */ /* private class ColorAction implements ActionListener//定義一個監聽器類 { private Color backgroundColor; public ColorAction(Color c) { backgroundColor = c; } public void actionPerformed(ActionEvent event)//監聽按鈕 { buttonPanel.setBackground(backgroundColor); } }*/ public void makeButton(String name,Color backgroundColor) { JButton button = new JButton(name);//用字串構造按鈕物件 buttonPanel.add(button);//把按鈕新增到面板上 /*ColorAction action = new ColorAction(backgroundColor);//用對應顏色構造一個監聽器 button.addActionListener(action);//註冊監聽器*/ new ActionListener() { public void actionPerformed(ActionEvent event)//就可以省掉顯示的監聽器類 { buttonPanel.setBackground(backgroundColor); } }; } } ButtonFrame
package button; import java.awt.*; import javax.swing.*; /** * @version 1.34 2015-06-12 * @author Cay Horstmann */ public class ButtonTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new ButtonFrame();//生成一個GUI介面類物件Frame frame.setTitle("ButtonTest");//左上方文字 frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//關閉按鈕退出介面 frame.setVisible(true);//Visible屬性為真，使介面視覺化 }); } }ButtonTest
用lambda表示式簡化程式
package button; import java.awt.*; import java.awt.event.*; import javax.swing.*; /** * A frame with a button panel */ public class ButtonFrame extends JFrame { private JPanel buttonPanel;// 該類物件屬性 private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public ButtonFrame() { setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);// 通過setsize來更改框架的寬度和高度 buttonPanel = new JPanel(); add(buttonPanel); makeButton("yellow", Color.yellow); makeButton("blue", Color.blue); makeButton("red", Color.red); makeButton("green", Color.green);// 新增一個新的元件只需要該條語句 } public void makeButton(String name, Color backgroundColor) { JButton button = new JButton(name); buttonPanel.add(button); button.addActionListener((e) -> { buttonPanel.setBackground(backgroundColor); }); } }ButtonFrame
測試程式2：
l 在elipse IDE中除錯執行教材449頁程式11-2，結合程式執行結果理解程式；
l 在元件觀感設定程式碼處添加註釋；
l 瞭解GUI程式中觀感的設定方法。
package plaf; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; import javax.swing.SwingUtilities; import javax.swing.UIManager; /** * A frame with a button panel for changing look-and-feel */ public class PlafFrame extends JFrame { private JPanel buttonPanel; public PlafFrame() { buttonPanel = new JPanel(); UIManager.LookAndFeelInfo[] infos = UIManager.getInstalledLookAndFeels();//列舉安裝的所有觀感器實現 for (UIManager.LookAndFeelInfo info : infos) makeButton(info.getName(), info.getClassName());//返回觀感的顯示名稱和觀感實現類的名稱 add(buttonPanel);//把按鈕新增到框架裡 pack(); } /** * Makes a button to change the pluggable look-and-feel. * @param name the button name * @param className the name of the look-and-feel class */ private void makeButton(String name, String className)//用輔助方法makeButton和匿名內部類指定按鈕動作，即切換觀感 { // add button to panel JButton button = new JButton(name); buttonPanel.add(button);//把按鈕新增到面板上 // set button action button.addActionListener(event -> { // button action: switch to the new look-and-feel try { UIManager.setLookAndFeel(className); SwingUtilities.updateComponentTreeUI(this);//this指示外圍物件 pack(); } catch (Exception e) { e.printStackTrace(); } }); } }PlafFrame
package plaf; import java.awt.*; import javax.swing.*; /** * @version 1.32 2015-06-12 * @author Cay Horstmann */ public class PlafTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new PlafFrame(); frame.setTitle("PlafTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } }PlafTest
測試程式3：
l 在elipse IDE中除錯執行教材457頁-458頁程式11-3，結合程式執行結果理解程式；
l 掌握AbstractAction類及其動作物件；
l 掌握GUI程式中按鈕、鍵盤動作對映到動作物件的方法。
package action;
import java.awt.*;
import java.awt.event.*; import javax.swing.*; /** * A frame with a panel that demonstrates color change actions. */ public class ActionFrame extends JFrame { private JPanel buttonPanel; private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; public ActionFrame() { setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT); buttonPanel = new JPanel(); // define actions //建立自己定義的ColorAction物件 Action yellowAction = new ColorAction("Yellow", new ImageIcon("yellow-ball.gif"), Color.YELLOW); Action blueAction = new ColorAction("Blue", new ImageIcon("blue-ball.gif"), Color.BLUE); Action redAction = new ColorAction("Red", new ImageIcon("red-ball.gif"), Color.RED); // add buttons for these actions //建立一個按鈕，其屬性從所提供的 Action中獲取 buttonPanel.add(new JButton(yellowAction)); buttonPanel.add(new JButton(blueAction)); buttonPanel.add(new JButton(redAction)); // add panel to frame add(buttonPanel); // associate the Y, B, and R keys with names InputMap imap = buttonPanel.getInputMap(JComponent.WHEN_ANCESTOR_OF_FOCUSED_COMPONENT);//當該元件包含了擁有鍵盤焦點的元件時 //將動作與擊鍵關聯起來，呼叫KeyStroke類的靜態getKeyStroke方法 imap.put(KeyStroke.getKeyStroke("ctrl Y"), "panel.yellow"); imap.put(KeyStroke.getKeyStroke("ctrl B"), "panel.blue"); imap.put(KeyStroke.getKeyStroke("ctrl R"), "panel.red"); // associate the names with actions //鍵與動作關聯 ActionMap amap = buttonPanel.getActionMap();//返回關聯動作對映鍵和動作物件的對映 amap.put("panel.yellow", yellowAction); amap.put("panel.blue", blueAction); amap.put("panel.red", redAction); } public class ColorAction extends AbstractAction { /** * Constructs a color action. * @param name the name to show on the button * @param icon the icon to display on the button * @param c the background color */ public ColorAction(String name, Icon icon, Color c) {//將與名字關聯的物件放置在動作物件內 putValue(Action.NAME, name); putValue(Action.SMALL_ICON, icon); putValue(Action.SHORT_DESCRIPTION, "Set panel color to " + name.toLowerCase()); putValue("color", c); } public void actionPerformed(ActionEvent event)//執行改變顏色的動作 { Color c = (Color) getValue("color");//返回被儲存的物件的值 buttonPanel.setBackground(c); } } }
ActionFrame
package action; import java.awt.*; import javax.swing.*; /** * @version 1.34 2015-06-12 * @author Cay Horstmann */ public class ActionTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new ActionFrame(); frame.setTitle("ActionTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } }ActionTest
測試程式4：
l 在elipse IDE中除錯執行教材462頁程式11-4、11-5，結合程式執行結果理解程式；
掌握GUI程式中滑鼠事件處理技術。
package mouse; import java.awt.*; import java.awt.event.*; import java.awt.geom.*; import java.util.*; import javax.swing.*; /** * A component with mouse operations for adding and removing squares. */ public class MouseComponent extends JComponent { private static final int DEFAULT_WIDTH = 300; private static final int DEFAULT_HEIGHT = 200; private static final int SIDELENGTH = 100;//滑鼠點選形成的方框邊長 private ArrayList<Rectangle2D> squares; private Rectangle2D current; // the square containing the mouse cursor public MouseComponent() { squares = new ArrayList<>(); current = null; addMouseListener(new MouseHandler()); addMouseMotionListener(new MouseMotionHandler()); } public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); } public void paintComponent(Graphics g) { Graphics2D g2 = (Graphics2D) g; // draw all squares for (Rectangle2D r : squares) g2.draw(r); } /** * Finds the first square containing a point. * @param p a point * @return the first square that contains p */ public Rectangle2D find(Point2D p) { for (Rectangle2D r : squares) { if (r.contains(p)) return r; } return null; } /** * Adds a square to the collection. * @param p the center of the square */ public void add(Point2D p) { double x = p.getX(); double y = p.getY(); current = new Rectangle2D.Double(x - SIDELENGTH / 2, y - SIDELENGTH / 2, SIDELENGTH, SIDELENGTH); squares.add(current); repaint(); } /** * Removes a square from the collection. * @param s the square to remove */ public void remove(Rectangle2D s) { if (s == null) return; if (s == current) current = null; squares.remove(s); repaint(); } //當滑鼠被按下時呼叫三個監聽器方法 private class MouseHandler extends MouseAdapter { public void mousePressed(MouseEvent event)//滑鼠第一次被按下時呼叫mousePressed { // add a new square if the cursor isn't inside a square //當滑鼠點選在所有小方塊的畫素之外時，就會繪製一個新的小方塊 current = find(event.getPoint()); if (current == null) add(event.getPoint()); } public void mouseClicked(MouseEvent event)//用mouseEvent類物件作為引數，呼叫getX和getY方法可以獲得滑鼠被按下時滑鼠指標所在的x和y座標 { // remove the current square if double clicked //如果使用者在某個小方塊中雙擊滑鼠，就會將它擦除 current = find(event.getPoint()); if (current != null && event.getClickCount() >= 2) remove(current); } } private class MouseMotionHandler implements MouseMotionListener { public void mouseMoved(MouseEvent event) { // set the mouse cursor to cross hairs if it is inside // a rectangle if (find(event.getPoint()) == null) setCursor(Cursor.getDefaultCursor()); else setCursor(Cursor.getPredefinedCursor(Cursor.CROSSHAIR_CURSOR));//游標位於一個小方塊之上時變成另一種形狀 } public void mouseDragged(MouseEvent event) { if (current != null) { int x = event.getX(); int y = event.getY(); // drag the current rectangle to center it at (x, y) // 獲得x,y繪圖 current.setFrame(x - SIDELENGTH / 2, y - SIDELENGTH / 2, SIDELENGTH, SIDELENGTH); repaint();//重新繪製 } } } }MouseComponent
package mouse; import javax.swing.*; /** * A frame containing a panel for testing mouse operations */ public class MouseFrame extends JFrame { public MouseFrame() { add(new MouseComponent());//向框架中新增一個JComponent的例項 pack(); } }MouseFrame
package mouse; import java.awt.*; import javax.swing.*; /** * @version 1.34 2015-06-12 * @author Cay Horstmann */ public class MouseTest { public static void main(String[] args) { EventQueue.invokeLater(() -> { JFrame frame = new MouseFrame(); frame.setTitle("MouseTest"); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); frame.setVisible(true); }); } }MouseTest
實驗2：結對程式設計練習
利用班級名單檔案、文字框和按鈕元件，設計一個有如下介面（圖1）的點名器，要求使用者點選開始按鈕後在文字輸入框隨機顯示2017級網路與資訊安全班同學姓名，如圖2所示，點選停止按鈕後，文字輸入框不再變換同學姓名，此同學則是被點到的同學姓名。
圖1 點名器啟動介面
圖2 點名器點名介面
package 點名器; import java.util.*; import java.awt.*; import javax.swing.*; import java.awt.event.*; import java.io.File; import java.io.FileNotFoundException; import javax.swing.event.*; public class NameFrame extends JFrame implements ActionListener{ //分別定義JLabel、JButton、boolean點名器為私有屬性 private JLabel jla; private JLabel jlb; private JButton jba; private static boolean flag = true; public NameFrame(){ this.setLayout(null);//設定 LayoutManager。重寫此方法，從而有條件地將呼叫轉發到 contentPane jla = new JLabel("姓名");//建立具有指定文字的 JLabel 例項，指定文字即“姓名” jlb = new JLabel("準備中"); jba = new JButton("開始");//建立一個帶文字的按鈕。文字即“開始” this.add(jla);//將指定元件追加到此容器的尾部。 this.add(jlb); //姓名元件相關設定 jla.setFont(new Font("Courier",Font.PLAIN,22));//設定元件字型，根據指定名稱、樣式和磅值大小，建立一個新 Font。 jla.setHorizontalAlignment(JLabel.LEFT);//設定標籤內容沿 X 軸的對齊方式。 這是一個 JavaBeans 繫結屬性。 jla.setVerticalAlignment(JLabel.CENTER);//設定標籤內容沿 Y 軸的對齊方式 jla.setBounds(70,100,180,30);//移動元件並調整其大小。由 x 和 y 指定左上角的新位置，由 width 和 height 指定新的大小。 jlb.setOpaque(true);//如果為 true，則該元件繪製其邊界內的所有畫素。否則該元件可能不繪製部分或所有畫素，從而允許其底層畫素透視出來。 //準備中元件的相關設定 jlb.setBackground(Color.pink); jlb.setFont(new Font("Courier",Font.PLAIN,22)); jlb.setHorizontalAlignment(JLabel.CENTER); jlb.setVerticalAlignment(JLabel.CENTER); jlb.setBounds(150,100,120,30); this.add(jba); jba.setBounds(150,150,80,26); jba.addActionListener(this); this.setTitle("點名器"); this.setBounds(400,400,400,300); this.setVisible(true);//顯示視覺化 this.setDefaultCloseOperation(DISPOSE_ON_CLOSE); } public void actionPerformed(ActionEvent e){//指示發生了元件定義的動作的語義事件 int i=0; String names[]=new String[50]; try { Scanner in=new Scanner(new File("I:\\大二上\\Java\\studentnamelist.txt")); while(in.hasNextLine())//如果在此掃描器的輸入中存在另一行，則返回 true { names[i]=in.nextLine(); i++; } } catch (FileNotFoundException e1) {//開啟檔案失敗時丟擲異常 // TODO Auto-generated catch block e1.printStackTrace(); } if(jba.getText()=="開始"){ jlb.setBackground(Color.PINK); flag = true; new Thread(){ public void run(){ while(NameFrame.flag){ Random r = new Random(); //建立一個新的隨機數生成器 int i= r.nextInt(47);//返回一個偽隨機數 jlb.setText(names[i]); } } }.start(); jba.setText("停止");//設定按鈕為：停止 jba.setBackground(Color.PINK); } else if(jba.getText()=="停止"){//返回停止按鈕 flag = false; jba.setText("開始"); jba.setBackground(Color.WHITE); jlb.setBackground(Color.pink); } } public static void main(String arguments []){ new NameFrame(); } }點名器
實驗總結：
理論知識：
一、 事件處理基礎：事件源；事件監聽器；事件物件
GUI設計中，程式設計師需要對元件的某種事件進行響應和處理時，必須完成兩個步驟：
1) 定義實現某事件監聽器介面的事件監聽器類，並具體化介面中宣告的事件處理抽象方法。
2) 為元件註冊實現了規定介面的事件監聽器物件；
註冊監聽器方法：eventSourceObject.addEventListener(eventListenerObject)
1、 建立按鈕物件
JButton類常用的一組構造方法：
（1） JButton(String text)：建立一個帶文字的按鈕
（2） JButton（Icon icon）：建立一個帶圖示的按鈕
（3） JButton（String text,Icon icon）：建立一個帶文字和圖示的按鈕
2、 按鈕物件的常用方法
（1） getLabel():返回按鈕的標籤字串；
（2） setLabel(String s):設定按鈕的標籤為字串s
用匿名類簡化程式（見實驗1）：
1) 使用字串構造按鈕物件；
2) 把按鈕新增到面板上；
3) 用對應的顏色構造一個動作監聽器；
4) 註冊動作監聽器。
3、改變觀感
Swing程式預設使用Metal觀感，採用兩種方式改變觀感。
第一種：在Java安裝的子目錄jre/lib下的檔案 swing.properties中，將屬性swing.defaultlaf設定為所希望的觀感類名
第二種：呼叫靜態的UIManager.setLookAndFeel方法，動態地改變觀感，提供所想要的觀感類名，再呼叫靜態方法SwingUtilities.updateComponentTreeUI來重新整理全部的元件集
3、 介面卡
a.鑑於程式碼簡化的要求，對於有不止一個方法的AWT 監聽器介面都有一個實現了它的所有方法，但卻不做任何工作的介面卡類。例：WindowAdapter類。
b.介面卡類動態地滿足了Java中實現監視器類的技術要求。
c.通過擴充套件介面卡類來實現視窗事件需要的動作。
註冊事件監聽器
- a. 可將一個Terminator物件註冊為事件監聽器： WindowListener listener=new Terminator(); frame.addWindowListener(listener);
- b. 只要框架產生一個視窗事件，該事件就會傳遞給監聽器物件。
二、動作事件（ActionEvent）:當特定元件動作（點選按鈕）發生時，該元件生成此動作事件。
該事件被傳遞給元件註冊的每一個ActionListener 物件，並呼叫監聽器物件的 actionPerformed方法以接收這類事件物件。能夠觸發動作事件的動作，主要包括：
(1) 點選按鈕 (2) 雙擊一個列表中的選項； (3) 選擇選單項； (4) 在文字框中輸入回車
命令按鈕JButton：
a.Action是一個介面，而不是一個類，實現這個接口的類必須要實現它的7個方法。
b.AbstractAction 類實現了Action介面中除 actionPerformed方法之外的所有方法，這個類儲存了所有名/值對,並管理著屬性變更監聽器。
b.在動作事件處理應用中，可以直接擴充套件AbstractAction類,並在擴充套件類中實現actionPerformed方法
擊鍵關鍵對映（見實驗4）：將一個動作物件新增到擊鍵中，以便讓使用者敲擊鍵盤命令來執行這個動作。將動作與擊鍵關聯起來，需生成KeyStroke類物件。
KeyStroke ctrBKey = KeyStroke.getKeyStroke(“Ctrl B”);
本次實驗我們學習了一些事件處理的相關知識，實驗課上在老師和學長的講解下，我們在測試程式1中對重複的元件設定程式碼用匿名內部類以及lambda表示式的方式簡化了程式，使繁雜變為簡單。在課後的學習中，我對GUI介面元件觀感設定方法相關知識還沒有太理解。此次實驗的最後一個點名器的程式，我只知道如何構造一個框架、新增按鈕、文字匯入等小模組，在組合時碰到了很多問題，最後是複製貼上的學長的程式碼，進行了小小修改，但是還是有好些地方不太懂。