Obsługa zdarzeń - Mysz

Ostatnim typem prostych zdarzeń generowanych przez użytkownika są kliknięcia, przeciągnięcia, lub po prostu zmiana położenia kursora myszy. Jak się w tej lekcji przekonamy ich obsługa również nie jest zbyt skomplikowana, a po napisaniu kilku aplikacji z wykorzystaniem tego mechanizmu będziemy mogli sprawnie się nim posługiwać. Postaramy się napisać prostą aplikację, która w odpowiedzi na kliknięcia w obszarze panelu będzie rysowała różne kształty, natomiast Twoim zadaniem będzie jego rozbudowa o dalszą funkcjonalność.

W przypadku zdarzeń generowanych przez klawiaturę używaliśmy interfejsu KeyListener, tym razem, jak nietrudno zgadnąć, schemat będzie podobny. Możemy jednak wyróżnić dwa interfejsy które służą do przechwytywania dwóch typów zdarzeń, które mogą zaistnieć

• MouseListener - interfejs słuchacza zdarzeń myszy. Odpowiedzialny za kliknięcia i pojawianie się kursora nad komponentem nasłuchującym.
• MouseMotionListener - interfejs, który pozwala przechwytywać zdarzenia związane z ruchem kursora.

Warto również wspomnieć o tym, że istnieją klasy MouseAdapter i MouseMotionAdapter, dzięki którym nie musimy implementować wszystkich metod, a tylko te, które są nam potrzebne - minusem jest oczywiście to, że w Javie nie ma dziedziczenia wielobazowego, więc jeśli rozszerzamy przykładowo klasę JPanel, nie będziemy mogli użyć klasy adaptera.

Przejdźmy do rzeczy. Interfejs MouseListener posiada pięć metod:

//metoda wywoływana, gdy następuje kliknięcie, czyli wciśnięcie i zwolnienie przycisku myszy, ale uwaga, obie te operacje muszą zajść w jednym położeniu.
 public void mouseClicked(MouseEvent event)
 
 //metoda wywoływana, gdy zostaje wciśnięty przycisk myszy\
 public void mousePressed(MouseEvent event)
 
 //metoda wywoływana, gdy następuje zwolnienie przycisku myszy
 public void mouseReleased(MouseEvent event)
 
 //metoda wywoływana, gdy kursor pojawia się w obszarze nasłuchującym na zdarzenia, na przykład panelu
 public void mouseEntered(MouseEvent event)
 
 //metoda wywoływana, gdy kursor opuszcza obszar nasłuchujący zdarzenia
 public void mouseExited(MouseEvent event)

Na szczęście ich nazwy są intuicyjne i zazwyczaj wiadomo której użyć. W przypadku mouseClicked należy jedynie pamiętać, że za kliknięcie uważamy wciśnięcie i zwolnienie przycisku w tym samym miejscu, jeśli przycisk wciśniemy, przesuniemy kursor i dopiero zwolnimy przycisk, wtedy zostaną wywołane zarówno mousePressed() oraz mouseReleased, ale nie mouseClicked().

Podobnie sprawa wygląda w przypadku interfejsu MouseMotionListener, jednak tutaj są tylko dwie metody:

//metoda wywoływana, gdy wciśniemy przycisk i przeciągniemy kursor
 public void mouseDragged(MouseEvent event)
 
 //metoda wywoływana, gdy poruszamy kursor w obszarze nasłuchującym zdarzenia
 public void mouseMoved(MouseEvent event)

Jak widać wszystkie z metod otrzymują jako parametr obiekt klasy MouseEvent . Przechowuje on bardzo dużo ciekawych informacji na temat zdarzenia, które nastąpiło. Możemy z niego odczytać położenie kursora zarówno względem punktu (0,0) naszego panelu, lub innego komponentu nasłuchującego, a także położenie na ekranie. Przycisk, który został wciśnięty, oraz wiele więcej, Dodatkowo klasa MouseEvent posiada szereg zdefiniowanych stałych, z którymi możemy porównywać dane otrzymane od systemu. Aby w ogóle móc przechwytywać zdarzenia myszy musimy najpierw dodać do komponentu nasłuchującego odpowiedniego słuchacza, za pomocą metod addMouseListener , lub addMouseMotionListener.

Na początek napiszmy prościutki program, który zawiera panel implementujący oba wspomniane interfejsy, a wszystko umieścimy w ramce. Informację o zdarzeniach będziemy wyświetlali w konsoli przy pomocy standardowego strumienia wyjścia.

Klasa panelu implementującego interfejsy:

import java.awt.event.MouseEvent;
 import java.awt.event.MouseListener;
 import java.awt.event.MouseMotionListener;
 import javax.swing.JPanel;
 
 public class MouseTestPanel extends JPanel implements MouseListener, MouseMotionListener {
 
 	public MouseTestPanel() {
 		addMouseListener(this);
 		addMouseMotionListener(this);
 	}
 
 	@Override
 	public void mouseDragged(MouseEvent arg0) {
 		System.out.println("mouseDragged");
 	}
 
 	@Override
 	public void mouseMoved(MouseEvent arg0) {
 		System.out.println("mouseMoved");
 	}
 
 	@Override
 	public void mouseClicked(MouseEvent e) {
 		System.out.println("mouseClicked");
 	}
 
 	@Override
 	public void mouseEntered(MouseEvent e) {
 		System.out.println("mouseEntered");
 	}
 
 	@Override
 	public void mouseExited(MouseEvent e) {
 		System.out.println("mouseExited");
 	}
 
 	@Override
 	public void mousePressed(MouseEvent e) {
 		System.out.println("mousePressed");
 	}
 
 	@Override
 	public void mouseReleased(MouseEvent e) {
 		System.out.println("mouseReleased");
 	}
 
 }

Klasa ramki i jednocześnie klasa testowa:

import java.awt.EventQueue;
 import javax.swing.JFrame;
 
 public class Frame extends JFrame {
 	public Frame() {
 		super("MouseTest");
 
 		add(new MouseTestPanel());
 		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 		setVisible(true);
 	}
 
 	public static void main(String[] args) {
 		EventQueue.invokeLater(new Runnable() {
 			@Override
 			public void run() {
 				new Frame();
 			}
 		});
 	}
 }

Należy oczywiście najpierw rozciągnąć sobie okienko, wjeżdżając i wychodząc z obszaru panelu, a także klikając w jego obszarze można zaobserwować w konsoli, które metody zostają wywoływane.

Przejdźmy jednak do tego o czym wspomniałem na początku. Napiszmy program, który w miejscu, w którym klikniemy narysuje jakieś kształty, np kwadraty. Nie ma tutaj znaczenia, czy użyjemy do tego celu metody mousePressed, mouseReleased, czy mouseClicked, wszystko zależy od naszej inwencji, ale przyjmijmy, że będzie to mousePressed.

Panel z rysowaniem kwadracików 10x10 pikseli:

import java.awt.*;
 import java.awt.*;
 import java.awt.event.*;
 import java.util.ArrayList;
 
 import javax.swing.JPanel;
 
 public class MouseTestPanel extends JPanel implements MouseListener {
 
 	private static final int DEFAULT_WIDTH = 200;
 	private static final int DEFAULT_HEIGHT = 200;
 
 	private int x, y;
 
 	ArrayList points = new ArrayList();
 
 	public MouseTestPanel() {
 		addMouseListener(this);
 		setPreferredSize(new Dimension(DEFAULT_WIDTH, DEFAULT_HEIGHT));
 	}
 
 	@Override
 	public void mouseClicked(MouseEvent e) {
 	}
 
 	@Override
 	public void mouseEntered(MouseEvent e) {
 	}
 
 	@Override
 	public void mouseExited(MouseEvent e) {
 	}
 
 	@Override
 	public void mousePressed(MouseEvent e) {
 		x = e.getX();
 		y = e.getY();
 		points.add(new Point(x, y));
 		repaint();
 	}
 
 	@Override
 	public void mouseReleased(MouseEvent e) {
 	}
 
 	@Override
 	protected void paintComponent(Graphics g) {
 		super.paintComponent(g);
 		Graphics2D g2d = (Graphics2D) g;
 		g2d.setColor(Color.WHITE);
 		g2d.fillRect(0, 0, this.getWidth(), this.getHeight());
 		g2d.setColor(Color.BLACK);
 		drawRectangles(g2d);
 	}
 
 	private void drawRectangles(Graphics2D g2d) {
 		int x, y;
 		for (Point p : points) {
 			x = (int) p.getX();
 			y = (int) p.getY();
 			g2d.fillRect(x, y, 10, 10);
 		}
 	}
 }

W skrócie. Posiadamy dwie zmienne x, y, które będą przechowywały miejsce, w których kliknął użytkownik. Dane do tego potrzebne otrzymamy w obiekcie MouseEvent, który jest parametrem wykorzystywanej przez nas metody mousePressed. Położenie kursora w momencie zajścia zdarzenia uzyskujemy dzięki metodom getX() oraz getY(). Dodatkowo stworzyliśmy zmienną typu boolean, dzięki której kwadracik nie jest rysowany po starcie programu w punkcie (0,0), czyli domyślnych wartości x i y. W metodzie mousePressed za każdym razem modyfikujemy zmienne x i y oraz wywołujemy metodę repaint(). Rysowanie polega na wypełnieniu tła białym kolorem i narysowaniu czarnego kwadracika o wymiarach 10x10 pikseli.

import java.awt.EventQueue;
 import javax.swing.JFrame;
 
 public class Frame extends JFrame {
 	public Frame() {
 		super("MouseTest");
 
 		add(new MouseTestPanel());
 		setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 		pack();
 		setVisible(true);
 	}
 
 	public static void main(String[] args) {
 		EventQueue.invokeLater(new Runnable() {
 			@Override
 			public void run() {
 				new Frame();
 			}
 		});
 	}
 }

W klasie ramki dodaliśmy znaną nam metodę pack(), która dostosowała rozmiar ramki do naszego panelu.

Jesteśmy już blisko końca, ale zapewne chcielibyśmy, aby na planszy pojawiały się wszystkie kwadraciki, które narysowaliśmy, a nie tylko jeden. Jak to najprościej uzyskać? Oczywiście musimy przechowywać gdzieś wartości punktów, w których zaszły kliknięcia. Mogłaby to być tablica, ale nie jest to dobre rozwiązanie, bo musielibyśmy z góry zakładać, jaka ilość kwadracików może pojawić się na planszy. Znacznie lepiej będzie wykorzystać jakąś strukturę danych - najlepiej listę. My wybierzemy listę tablicową ArrayList , ale mogłaby to być równie dobrze LinkedList. Dodatkowo dodamy do niej parametr, który określi, konkretny typ obiektów, co chroni nas przed rzutowaniem. Jedyne zmiany zachodzą w klasie panelu, więc jedynie jego kod umieszczono poniżej:

import java.awt.*;
 import java.awt.event.*;
 import java.util.ArrayList;
 
 import javax.swing.JPanel;
 
 public class MouseTestPanel extends JPanel implements MouseListener {
 
 	private static final int WIDTH = 200;
 	private static final int HEIGHT = 200;
 
 	private int x, y;
 
 	ArrayList<Point> points = new ArrayList<Point>();
 
 	public MouseTestPanel() {
 		addMouseListener(this);
 		setPreferredSize(new Dimension(WIDTH, HEIGHT));
 	}
 
 	@Override
 	public void mouseClicked(MouseEvent e) {
 	}
 
 	@Override
 	public void mouseEntered(MouseEvent e) {
 	}
 
 	@Override
 	public void mouseExited(MouseEvent e) {
 	}
 
 	@Override
 	public void mousePressed(MouseEvent e) {
 		x = e.getX();
 		y = e.getY();
 		points.add(new Point(x, y));
 		repaint();
 	}
 
 	@Override
 	public void mouseReleased(MouseEvent e) {
 	}
 
 	@Override
 	protected void paintComponent(Graphics g) {
 		super.paintComponent(g);
 		Graphics2D g2d = (Graphics2D) g;
 		g2d.setColor(Color.WHITE);
 		g2d.fillRect(0, 0, WIDTH, HEIGHT);
 		g2d.setColor(Color.BLACK);
 		drawRectangles(g2d);
 	}
 
 	private void drawRectangles(Graphics2D g2d) {
 		int x, y;
 		for(Point p: points) {
 			x = (int)p.getX();
 			y = (int)p.getY();
 			g2d.fillRect(x, y, 10, 10);
 		}
 	}
 }

Ponieważ kolekcje nie były jeszcze szczegółowo omawiane, a o typach generycznych było jedynie kilka wzmianek jestem winny wam pewne objaśnienie co do części kodu:

ArrayList<Point> points = new ArrayList<Point>();

Tworzymy tutaj dynamiczną strukturę danych. Najprościej rzecz ujmując jest to tablica, która potrafi sama zwiększać swój rozmiar, gdy zajdzie taka potrzeba. Klasa ArrayList jest częścią frameworka Collections, zawierającego kilka innych struktur.

Dzięki temu, że dodaliśmy jej konkretny typ (tzw typ generyczny), wiemy jakie obiekty będziemy przechowywać - w naszym przypadku Point. Więcej na ten temat możecie przeczytać w tej lekcji.

Wracając do naszego panelu, zmiana polega na tym, że teraz po każdym kliknięciu myszy prze użytkownika dodajemy do listy points nowy obiekt typu Point (położenie punktu na płaszczyźnie), a nie tak jak wcześniej od razu go rysujemy. Stworzyliśmy pomocniczą metodę drawRectangles(), w której przy pomocy pętli for each rysujemy wszystkie nasze kwadraty na podstawie punktów znajdujących się w kolekcji (ArrayList implementuje interfejs Iterable, dzięki czemu jest to możliwe). W metodzie paintComponent() przekazujemy jej obiekt typu Graphics2D związany z danym kontekstem, dzięki któremu możemy rysować. Wyrzuciliśmy z kodu również zmienną blokującą rysowanie kwadracika po starcie systemu, ponieważ teraz rysujemy obiekty z kolekcji, która na początku jest domyślnie pusta.