實驗十三  圖形介面事件處理技術

實驗時間 2018-11-22

理論知識與學習部分

事件處理基礎  事件源（event source）：能夠產生事件的物件都可 以成為事件源，如文字框、按鈕等。一個事件源是一個 能夠註冊監聽器並向監聽器傳送事件物件的物件。

 事件監聽器（event listener）：事件監聽器物件接 收事件源傳送的通告（事件物件），並對發生的事件作 出響應。一個監聽器物件就是一個實現了專門監聽器接 口的類例項，該類必須實現介面中的方法，這些方法當 事件發生時,被自動執行。

 事件物件（event object）：Java將事件的相關資訊 封裝在一個事件物件中，所有的事件物件都最終派生於 java.util.EventObject類。不同的事件源可以產生不 同類別的事件

AWT事件處理機制的概要：  監聽器物件:是一個實現了特定監聽器介面（ listener interface）的類例項。

 事件源:是一個能夠註冊監聽器物件併發送事件對 象的物件。

當事件發生時，事件源將事件物件自動傳遞給所 有註冊的監聽器。

 監聽器物件利用事件物件中的資訊決定如何對事 件做出響應。

GUI設計中，程式設計師需要對元件的某種事件進行響應和處理時，必須完成兩個步驟：

1) 定義實現某事件監聽器介面的事件監聽器類，並具體化介面中宣告的事件處理抽象方法。

2) 為元件註冊實現了規定介面的事件監聽器物件；

 註冊監聽器方法 eventSourceObject.addEventListener(eventListenerObject)

 下面是監聽器的一個示例： ActionListener listener = …;

JButton button=new JButton(“Ok”); button.addActionListener(listener);

 動作事件（ActionEvent）:當特定元件動作（點 擊按鈕）發生時，該元件生成此動作事件。

該 事 件 被 傳 遞 給 組 件 注 冊 的 每 一 個 ActionListener 物件， 並 調 用 監 聽 器 對 象 的 actionPerformed方法以接收這類事件物件。

 能夠觸發動作事件的動作，主要包括：

(1) 點選按鈕

(2) 雙擊一個列表中的選項；

(3) 選擇選單項；

(4) 在文字框中輸入回車。

1、實驗目的與要求

(1) 掌握事件處理的基本原理，理解其用途；

(2) 掌握AWT事件模型的工作機制；

(3) 掌握事件處理的基本程式設計模型；

(4) 瞭解GUI介面元件觀感設定方法；

(5) 掌握WindowAdapter類、AbstractAction類的用法；

(6) 掌握GUI程式中滑鼠事件處理技術。

2、實驗內容和步驟

實驗1： 匯入第11章示例程式，測試程式並進行程式碼註釋。

測試程式1：

l 在elipse IDE中除錯執行教材443頁-444頁程式11-1，結合程式執行結果理解程式；

l 在事件處理相關程式碼處添加註釋；

package button;

import java.awt.*;
import java.awt.event.*;
import javax.swing.*;

/**
 *  帶按鈕面板的框架 
 */
public class ButtonFrame extends JFrame
{
   private JPanel buttonPanel;//定義JPanel屬性
   private static final int DEFAULT_WIDTH = 600;
   private static final int DEFAULT_HEIGHT = 400;

   public ButtonFrame()
   {      
      setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);//通過setSize更改了寬度和高度的屬性值

      //建立按鈕         生成了三個按鈕物件，顯示在視窗物件上的title文字
      JButton yellowButton = new JButton("Yellow");
      JButton blueButton = new JButton("Blue");
      JButton redButton = new JButton("Red");

      buttonPanel = new JPanel();//使new JPanel指向物件buttonPanel

      //向面板新增按鈕          通過add方法新增三個按鈕元件
      buttonPanel.add(yellowButton);
      buttonPanel.add(blueButton);
      buttonPanel.add(redButton);

      // 將面板新增到幀 
      add(buttonPanel);

      // 建立按鈕動作 
      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);
   }

   /**
    * 設定面板背景顏色的動作偵聽器。
    */
   private class ColorAction implements ActionListener
   //ColorAction類後面實現了一個監聽器介面類ActionListener
   {
      private Color backgroundColor;

      public ColorAction(Color c)
      {
         backgroundColor = c;
      }

      public void actionPerformed(ActionEvent event)
      {
         buttonPanel.setBackground(backgroundColor);
      }
   }
}

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();
         frame.setTitle("ButtonTest");
         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//預設情況下，該值被設定為 HIDE_ON_CLOSE。更改此屬性的值將導致激發屬性更改事件，其屬性名稱為 "defaultCloseOperation"。 
         frame.setVisible(true);
      });
   }
}

l 用lambda表示式簡化程式；

l 掌握JButton元件的基本API；

l 掌握Java中事件處理的基本程式設計模型。

測試程式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;

/**
 * 帶有按鈕面板的框架，用於改變外觀和感覺 
 */
public class PlafFrame extends JFrame
{
   private JPanel buttonPanel;

   public PlafFrame()
   {
      buttonPanel = new JPanel();//例項化一個新的JPanel 

      //獲取所有的顯示樣式UIManager.setLookAndFeel(infos[0].getClassName())
      UIManager.LookAndFeelInfo[] infos = UIManager.getInstalledLookAndFeels();
      for (UIManager.LookAndFeelInfo info : infos)
         makeButton(info.getName(), info.getClassName());

      add(buttonPanel);//增加按鍵點選事件
      pack();
   }

   /**
    * 製作一個按鈕來改變可插入的外觀和感覺。 
    * @param name the button name
    * @param className the name of the look-and-feel class
    */
   private void makeButton(String name, String className)
   {
      // 向面板新增按鈕 

      JButton button = new JButton(name);
      buttonPanel.add(button);

      // 設定按鈕動作 

      button.addActionListener(event -> {
         // 按鈕動作：切換到新的外觀和感覺 
         try
         {
            //設定成你所使用的平臺的外觀。  java的圖形介面外觀有3種,預設是java的金屬外觀,還有就是windows系統,motif系統外觀.
            UIManager.setLookAndFeel(className);
            //簡單的外觀更改：將樹結構中的每個節點轉到 updateUI() 也就是說，通過當前外觀初始化其 UI 屬性。
            SwingUtilities.updateComponentTreeUI(this);
            pack();//依據放置的元件設定視窗的大小, 使之正好能容納放置的所有元件
         }
         catch (Exception e)//丟擲異常
         {
            e.printStackTrace();//深層次的輸出異常呼叫的流程。
         }
      });
   }
}

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();//生成PlafFrame物件
         frame.setTitle("PlafTest");//設定組建的自定義標題測試按鈕
         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//設定預設的關閉操作，引數在關閉動作時退出
         frame.setVisible(true);//一個圖形介面預設都是不可見的，setVisible把圖形介面設定為可見
      });
   }
}

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.*;
/**
 * 具有顯示顏色變化動作的面板的框架
 */
public class ActionFrame extends JFrame
{
   private JPanel buttonPanel;
   private static final int DEFAULT_WIDTH = 500;
   private static final int DEFAULT_HEIGHT = 200;

   public ActionFrame()
   {
      setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
      // 設定預設寬度和高度
      buttonPanel = new JPanel();
      // 將類的例項域中的JPanel面板物件例項化
      Action yellowAction = new ColorAction("Yellow", new ImageIcon("yellow-ball.gif"),
            Color.YELLOW);
      // 建立一個自己定義的ColorAction物件yellowAction
      Action blueAction = new ColorAction("Blue", new ImageIcon("blue-ball.gif"), Color.BLUE);
      Action redAction = new ColorAction("Red", new ImageIcon("red-ball.gif"), Color.RED);

      //建立一個按鈕，其屬性從所提供的 Action中獲取
      buttonPanel.add(new JButton(yellowAction));
      buttonPanel.add(new JButton(blueAction));
      buttonPanel.add(new JButton(redAction));

      //我們將這個新增好按鈕的面板新增到原框架中
      add(buttonPanel);

      //我們將JPanel物件的InputMap設定為第二種輸入對映，並建立該物件
      InputMap imap = buttonPanel.getInputMap(JComponent.WHEN_ANCESTOR_OF_FOCUSED_COMPONENT);
      imap.put(KeyStroke.getKeyStroke("ctrl Y"), "panel.yellow");
      imap.put(KeyStroke.getKeyStroke("ctrl B"), "panel.blue");
      imap.put(KeyStroke.getKeyStroke("ctrl R"), "panel.red");
      // 在imap中通過呼叫擊鍵類KeyStroke的靜態方法設定擊鍵輸入ctrl+Y的組合
      // 第二個引數是一個標誌引數，將這對引數用鍵值對的形式存入imap

      // 將imap中標記引數對應的擊鍵組合和相應的Action組合起來 
      ActionMap amap = buttonPanel.getActionMap();
      amap.put("panel.yellow", yellowAction);
      amap.put("panel.blue", blueAction);
      amap.put("panel.red", redAction);
   }
   
   public class ColorAction extends AbstractAction
   {
      /**
       * 構造顏色動作。
       * @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);
       //在構造器中設定一些鍵值對對映,這些設定的屬性將會被JPanel讀取
      }

      /**
       * 當按鈕點選或擊鍵的時候，會自動的呼叫actionPerformed方法
       */
      public void actionPerformed(ActionEvent event)
      {
         Color c = (Color) getValue("color");
         buttonPanel.setBackground(c);
         // 呼叫setBackground方法，設定背景顏色
      }
   }
}

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();//生成ActionFrame物件
         frame.setTitle("ActionTest");//設定組建的自定義標題測試按鈕
         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//設定預設的關閉操作，引數在關閉動作時退出
         frame.setVisible(true);//一個圖形介面預設都是不可見的，setVisible把圖形介面設定為可見
      });
   }
}

測試程式4：

l 在elipse IDE中除錯執行教材462頁程式11-4、11-5，結合程式執行結果理解程式；

l 掌握GUI程式中滑鼠事件處理技術。

package mouse;

import java.awt.*;
import java.awt.event.*;
import java.awt.geom.*;
import java.util.*;
import javax.swing.*;

/**
 * 一個帶有滑鼠操作的用於新增和刪除正方形的元件。 
 */
public class MouseComponent extends JComponent
{
   private static final int DEFAULT_WIDTH = 300;
   private static final int DEFAULT_HEIGHT = 200;

   private static final int SIDELENGTH = 10;// 定義創造的正方形的邊長
   private ArrayList<Rectangle2D> squares;// 宣告一個正方形集合
   private Rectangle2D current; // java類庫中用來描述矩形的類，它的物件可以看作是一個矩形 

   public MouseComponent()
   {
      squares = new ArrayList<>();
      current = null;

      addMouseListener(new MouseHandler());
      // 新增一個我們實現的類，這個類繼承了監測滑鼠點選情況的MouseListener
      addMouseMotionListener(new MouseMotionHandler());
      // 新增另一個實現類，這個類繼承了監測滑鼠移動情況的MouseMotionListener
   }

   public Dimension getPreferredSize() { return new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT); }   
   
   public void paintComponent(Graphics g)
   {
      Graphics2D g2 = (Graphics2D) g;
      // 轉換為我們需要使用的型別

      // 繪製所有正方形 
      for (Rectangle2D r : squares)
         g2.draw(r);
      // 對陣列中的每個正方形，都進行繪製
   }

   /**
    * 判斷在這個座標上是否有圖形
    * @param p a point
    * @return the first square that contains p
    */
   public Rectangle2D find(Point2D p)
   {
      for (Rectangle2D r : squares)
      {
         if (r.contains(p)) //contains方法測定座標是否在圖形的邊界內
             return r;
      }
      // 如果在squares這個陣列中有這個位置的座標，表明這個位置上非空
      // 返回這個位置上的物件
      return null;
      // 否則如果什麼都沒有，返回null

   }

   /**
    * 在這個座標位置增加一個圖形 
    * @param p the center of the square
    */
   public void add(Point2D p)
   {
      double x = p.getX();
      double y = p.getY();
      //獲取x和y的座標
      
      current = new Rectangle2D.Double(x - SIDELENGTH / 2, y - SIDELENGTH / 2, SIDELENGTH,
            SIDELENGTH);
      //用獲得的座標和既定的邊長構建一個新的正方形，並將其賦值給current

      squares.add(current);//將current新增到squares佇列中
      repaint();//重繪影象
   }

   /**
    * 從集合中移除正方形。 
    * @param s the square to remove
    */
   public void remove(Rectangle2D s)
   {
      if (s == null) return;//如果要移除的內容為空，直接返回
      if (s == current) current = null;
      //如果要移除的內容和current正指向的內容相同，則將current清空
      //避免發生不必要的錯誤

      squares.remove(s);//將s從squares的列表中直接刪去
      repaint();//重繪component的方法
   }

   private class MouseHandler extends MouseAdapter
   {
      public void mousePressed(MouseEvent event)//滑鼠按下方法
      {
         // 如果游標不在正方形中，則新增一個新的正方形
         current = find(event.getPoint());
         // 將滑鼠單擊的這個點的座標的物件賦給current
         if (current == null)
            //如果這個點沒有物件，當前指向空的位置
             add(event.getPoint());
             //在這個點繪製正方形
       
      }

      public void mouseClicked(MouseEvent event)//滑鼠單擊方法
      {
         // 如果雙擊，刪除當前方塊 
         current = find(event.getPoint());// 將滑鼠單擊的這個點的座標的物件賦給current
         if (current != null && event.getClickCount() >= 2) 
          //如果這個點有物件，而且點選滑鼠的次數大於2
             remove(current);
              //移除current
      }
   }

   private class MouseMotionHandler implements MouseMotionListener
   {
      public void mouseMoved(MouseEvent event)//如果滑鼠移動
      {
         // set the mouse cursor to cross hairs if it is inside設定滑鼠游標 
         //矩形; 

         if (find(event.getPoint()) == null) 
            //如果滑鼠所在位置不是空
             setCursor(Cursor.getDefaultCursor());
              //則將游標的影象設定為預設的影象
         else 
             setCursor(Cursor.getPredefinedCursor(Cursor.CROSSHAIR_CURSOR));
              //如果當前位置有影象，則將游標樣式設定為手型
      }

      public void mouseDragged(MouseEvent event)//如果滑鼠拖動
      {
         if (current != null)
{
            //因為在呼叫這個方法之前肯定會呼叫點選滑鼠的方法
            //所以我們直接判斷：如果現在current不為空
            //畫素（強制轉換為int） 
            int x = event.getX();
            int y = event.getY();
            //獲取到座標
            
            current.setFrame(x - SIDELENGTH / 2, y - SIDELENGTH / 2, SIDELENGTH, SIDELENGTH);
            //最後在滑鼠放下時進行圖形繪製
            repaint();//重繪影象
         }
      }
   }   
}

package mouse;

import javax.swing.*;

/**
 * 繼承JFrame的子類，將Component物件內容打包
 */
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();//生成MouseFrame物件
         frame.setTitle("MouseTest");//設定組建的自定義標題測試按鈕
         frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);//設定預設的關閉操作，引數在關閉動作時退出
         frame.setVisible(true);//一個圖形介面預設都是不可見的，setVisible把圖形介面設定為可見
      });
   }
}

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{
    private JLabel jla;
    private JLabel jlb;
    private JButton jba;
    private static boolean flag = true;//私有靜態布林標誌=真
    public NameFrame(){
        this.setLayout(null);
      
        
        jba = new JButton("開始");
        jla = new JLabel("姓名");
        jlb = new JLabel("隨機點名器");
        this.add(jla);
        this.add(jlb);
        jla.setFont(new Font("Courier",Font.PLAIN,44));
        jla.setHorizontalAlignment(JLabel.CENTER);
         jla.setVerticalAlignment(JLabel.CENTER);        
         jla.setBounds(20,100,180,30);//這裡定義的姓名的大小位置方位
         jlb.setOpaque(true);
         jlb.setBackground(Color.cyan);
         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(200,150,70,23);
      
         jba.addActionListener(this);

         this.setTitle("點名器");//設定窗格大小
        this.setBounds(500,500,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("D:\\studentnamelist.txt"));//檔案地址
            while(in.hasNextLine())
            {
                names[i]=in.nextLine();
                i++;
            }
        } catch (FileNotFoundException e1) {
            // TODO Auto-generated catch block
            e1.printStackTrace();
        }
        if(jba.getText()=="開始"){
            jlb.setBackground(Color.cyan);//設定此元件的背景色
            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.GREEN);//設定停止按鈕的顏色
        }    
        else if(jba.getText()=="停止"){
            flag = false;
            jba.setText("開始");
            jba.setBackground(Color.BLUE);//開始按鈕的背景顏色
            jlb.setBackground(Color.lightGray);
        }
     }
    public static void main(String arguments []){ 
        new NameFrame();
    }
}

實驗總結：

       通過這次實驗，我理解了AWT事件模型的工作機制，以及事件處理的基本程式設計模型，瞭解了GUI介面元件觀感設定方法，也對WindowAdapter類的用法有了基本的瞭解，GUI程式中滑鼠事件處理技術。雖然學長將點名程式發給了我們，但是我還是很多地方沒懂，所以沒有怎麼修改，以後還是要多讀程式，對以前學的知識也要多看，這樣才能為以後打下基礎。