GUI Tutorial Day 4. More GUI action  adding a Mouse Listener  SimpleDots  Simple mouse listener  Draw an oval where the mouse is clicked  Box example.

Slides:



Advertisements
Similar presentations
Rectangles moving and responding to the mouse. We want a window with a pile of rectangles in it When we click a rectangle it changes from filled to unfilled.
Advertisements

2D Graphics Drawing Things. Graphics In your GUI, you might want to draw graphics E.g. draw lines, circles, shapes, draw strings etc The Graphics class.
Made with love, by Zachary Langley Applets The Graphics Presentation.
Mouse Listeners We continue our examination of GUIs by looking at how to interact with the mouse –Just as Java creates Events when the user interacts with.
Introduction to Java Classes, events, GUI’s. Understand: How to use TextPad How to define a class or object How to create a GUI interface How event-driven.
Managing Input Events in Swing Week 5 Workshop Lyn Bartram.
Computer Science 209 Graphics and GUIs. Working with Color The class java.awt.Color includes constants for typical color values and also supports the.
1 Inheritance. 2 One class inherits from another if it describes a specialized subset of objects Terminology: inheritschild class subclass –the class.
Mouse Events and Keyboard Events
Event Handling Events and Listeners Timers and Animation.
Lecture 18 Review the difference between abstract classes and interfaces The Cloneable interface Shallow and deep copies The ActionListener interface,
CS/ENGRD 2110 FALL 2014 Lecture 15: Graphical User Interfaces (GUIs): Listening to events 1.
Mouse Events. Handling Mouse Events Java provides two listener interfaces to handle mouse events: MouseListener;  MouseListener;  MouseMotionListener.
Introducing Graphics There are generally two types of graphics facilities in Java –Drawing –GUIs We concentrate on drawing here We will draw on a Graphics.
CSE 219 Computer Science III Images. HW1 Has been posted on Blackboard Making a Game of Life with limited options.
Adding Graphics to a Frame Application Applets: Can generate drawings by overriding paint Frame: Do not draw directly on a frame. Draw graphics on a JPanel.
KeyListener and Keyboard Events Another type of listener listens for keyboard entry – the KeyListener which generates KeyEvents –to implement KeyListener,
Chapter 12 Event Handling. Chapter Goals To understand the Java event model To install action and mouse event listeners To accept input from buttons,
Java GUI’s are event driven, meaning they generate events when the user interacts with the program. Typical events are moving the mouse, clicking a mouse.
Programming and Problem Solving With Java Copyright 1999, James M. Slack Graphics in Java Applications The Graphics Class The Canvas Class The MouseListener.
CSE 501N Fall ‘09 20: Event Handling and Inner Classes 17 November 2009 Nick Leidenfrost.
SD2071 Games Programming Abstraction, inheritance and interfaces Exceptions Two dimensional arrays Java collections framework Files Aaron Kans.
7/3/00SEM107- © Kamin & ReddyClass 11 - Events - 1 Class 11 - Events r A couple of odds & ends m Component sizes  switch statement r Event types r Catching.
Previous programs used a JLabel for OUTPUT. Another Swing component that can be used for both user input and output is the JTextfield. Suppose we want.
Fall 2006Adapded from Java Concepts Companion Slides1 Event Handling Advanced Programming ICOM 4015 Lecture 13 Reading: Java Concepts Chapter 12.
1 CSC111H Graphical User Interfaces (GUIs) Introduction GUIs in Java Understanding Events A Simple Application The Containment Hierarchy Layout Managers.
OOP (Java): GUI II/ OOP Objectives – –describe some more GUI features: JPanel, and mouse listeners/adapters Semester 2,
Copyright © 2013 by John Wiley & Sons. All rights reserved. GRAPHICAL USER INTERFACES CHAPTER Slides by Donald W. Smith TechNeTrain.com Final Draft 10/30/11.
CS2110. GUIS: Listening to Events 1 Download the demo zip file from course website and look at the demos of GUI things: sliders, scroll bars, combobox.
Graphic User Interface. Graphic User Interface (GUI) Most of us interact with computers using GUIs. GUIs are visual representations of the actions you.
Copyright © 2002, Systems and Computer Engineering, Carleton University b-Gui2.ppt * Object-Oriented Software Development Part 18-b Building.
CSC 1051 – Data Structures and Algorithms I Dr. Mary-Angela Papalaskari Department of Computing Sciences Villanova University Course website:
MSc Workshop - © S. Kamin, U.Reddy Lect 4 - Events - 1 Lecture 4 – Event Handling r Painting r Event types r Catching different event types.
CSE 219 Computer Science III Image Manipulation. HW 1 Has been posted on Blackboard Making a Game of Life with limited.
12/5/00SEM107, Kamin & ReddyReview - 34 Events Event types Catching different event types Getting information from components and events Distinguishing.
For (int i = 1; i
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Outline 21.1 Test-Driving the Painter Application.
(C) 2010 Pearson Education, Inc. All rights reserved.  Class Graphics (from package java.awt) provides various methods for drawing text and shapes onto.
©2000, John Wiley & Sons, Inc. Horstmann/Java Essentials, 2/e Chapter 10: Event Handling 1 Event Handling.
GUI DYNAMICS Lecture 11 CS2110 – Fall GUI Statics and GUI Dynamics  Statics: what’s drawn on the screen  Components buttons, labels, lists, sliders,
1 Lecture 25 Listening to buttons and mice Quotes by Tony Hoare There are two ways of constructing a software design: (1) make it so simple that there.
CHAPTER 10 EVENT HANDLING. CHAPTER GOALS To understand the Java event model To install mouse and action listeners To accept mouse and text input To display.
©2000, John Wiley & Sons, Inc. Horstmann/Java Essentials, 2/e Chapter 10: Event Handling 1 Chapter 10 Event Handling.
Mouse Listeners Moving the mouse will also generate events like the Timer –To have your program respond, you must implement either or both of MouseListener.
Object-Oriented Software Engineering Using Threads and simple Animation.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Outline 27.1 Test-Driving the Drawing Shapes Application.
CS Lecture 04 Mice Lynda Thomas
Laboratory Study November, Demonstrates Life Cycle of an Applet + Mouse Events + Scrolling.
1/18H212Mouse and Timer Events H212 Introduction to Software Systems Honors Lecture #16: Mouse and Timer Events October 26, 2015.
MT311 Java Application Development and Programming Languages Li Tak Sing ( 李德成 )
Event Handling H_Func(Event) { } Event Receiver Object Source Object Registration.
Big Java by Cay Horstmann Copyright © 2008 by John Wiley & Sons. All rights reserved. Event Handling and GUI Components.
GUI Tutorial 2. What did we do last time?  Basic flow  instance variables, set up in ctor, close operation, size, visible  JFrame  Event-driven programming.
CSC 1051 – Data Structures and Algorithms I Dr. Mary-Angela Papalaskari Department of Computing Sciences Villanova University Course website:
Swing GUI Components So far, we have written GUI applications which can ‘ draw ’. These applications are simple, yet typical of all Java GUI applications.
Lesson 33: Layout management and drawing – Java GUI.
Basic Graphics 03/03/16 & 03/07/16 Imagine! Java: Programming Concepts in Context by Frank M. Carrano, (c) Pearson Education - Prentice Hall, 2010.
C Sc 335 Object-Oriented Programming and Design Rick Mercer
Mouse, Keyboard, Sounds, and Images JavaMethods An Introduction to Object-Oriented Programming Maria Litvin Gary Litvin Copyright © 2003 by Maria Litvin,
Prepared by: Dr. Abdallah Mohamed, AOU-KW Unit7: Event-driven programming 1.
10/20/2005week71 Graphics, mouse and mouse motion events, KeyEvent Agenda Classes in AWT for graphics Example java programs –Graphics –Mouse events –Mouse.
Object-Orientated Analysis, Design and Programming
Computer Science 209 Graphics and GUIs.
Outline The switch Statement The Conditional Operator The do Statement
Chapter 12 Event Handling
CS2110. GUIS: Listening to Events
Web Design & Development Lecture 12
Lecture 21. Listening to events on a GUI (and development of a loop)
CS2110. GUIS: Listening to Events
Presentation transcript:

GUI Tutorial Day 4

More GUI action  adding a Mouse Listener  SimpleDots  Simple mouse listener  Draw an oval where the mouse is clicked  Box example  Get coordinates of mouse click  Determine if mouse click is within a rectangle

Mouse Listener Interface with five methods:  public void mouseClicked (MouseEvent event)  public void mouseReleased (MouseEvent event)  public void mouseEntered (MouseEvent event)  public void mouseExited (MouseEvent event)  public void mousePressed (MouseEvent event)

Start with a JFrame import javax.swing.*; public class SimpleDots { public static void main (String[] args) { JFrame frame = new JFrame ("Dots"); frame.setDefaultCloseOperation (JFrame.EXIT_ON_CLOSE); frame.getContentPane().add (new DotsPanel()); frame.setSize(200, 200); frame.setVisible(true); }

Panel with paintComponent public class DotsPanel extends JPanel { private ArrayList points; public final int WIDTH = 10; public final int HEIGHT = 10; public DotsPanel() { points = new ArrayList (); setBackground (Color.black); // BACKGROUND COLOR addMouseListener(new DotsListener()); // ADD LISTENER TO PANEL } public void paintComponent(Graphics g) { super.paintComponent(g); g.setColor(Color.cyan); // draws every point for (Point p : points) { g.fillOval(p.x, p.y, WIDTH, HEIGHT); }

Add the mouse listener private class DotsListener implements MouseListener { public void mousePressed (MouseEvent event) { // update the list of points points.add(event.getPoint()); repaint(); // MUST CALL REPAINT } // Empty definitions for unused event methods. public void mouseClicked (MouseEvent event) {} public void mouseReleased (MouseEvent event) {} public void mouseEntered (MouseEvent event) {} public void mouseExited (MouseEvent event) {} }

Where did I click?  MouseClicker example shows:  Another JFrame option (variable, no Extends)  Accessing x/y coordinates of click  We will also see:  Another listener option (JPanel implements listener)  Create random colors using RGB  Determine what object was clicked

An object to draw: instance variables public class ABox { // constants to control drawing public static final int BOX_WIDTH = 100; public static final int BOX_HEIGHT = 200; public static final int BOX_MARGIN = 10; // id is automatically assigned, use a static variable to keep track private static int nextId = 1; // instance variables private Color color; private int id; // Store location to test mouse click private int x, y;

Construct box and pick a color public ABox(int x, int y) { this.x = x; this.y = y; setRandomColor(); id = nextId; nextId++; } private void setRandomColor() { Random rand = new Random(); int red = rand.nextInt(256); int blue = rand.nextInt(256); int green = rand.nextInt(256); color = new Color(red, green, blue); } To read more about color in general:

Draw the box, determine if clicked public void draw(Graphics g) { g.setColor(color); g.fillRect(x, y, BOX_WIDTH, BOX_HEIGHT); g.setColor(Color.BLACK); g.drawString("Id-"+id, x+BOX_MARGIN, y+BOX_MARGIN); } public boolean containsClick(int mouseX, int mouseY) { Rectangle rect = new Rectangle(x, y, BOX_WIDTH, BOX_HEIGHT); if (rect.contains(new Point(mouseX, mouseY))) return true; return false; } public Color getColor() { return color; }

Construct a panel public class MouseClickerPanel extends JPanel implements MouseListener { public final int BOXES_PER_ROW = 3; // constants to control drawing public final int MARGIN = 10; private ArrayList boxes; // boxes to draw public MouseClickerPanel(int numBoxes) { createBoxes(numBoxes); // Determine panel size based on box and margin values int width = BOXES_PER_ROW*ABox.BOX_WIDTH + (MARGIN*2); int numRows = numBoxes / BOXES_PER_ROW + 1; int height = numRows * ABox.BOX_HEIGHT; setPreferredSize(new Dimension(width, height)); // Set up this panel (i.e., myself) to listen for mouse clicks addMouseListener(this); }

Create boxes and display private void createBoxes(int numBoxes) { boxes = new ArrayList (); for (int i=0; i<numBoxes; i++) { int x = (MARGIN + ABox.BOX_WIDTH) * (i%BOXES_PER_ROW); int row = i/BOXES_PER_ROW; int y = row * (MARGIN + ABox.BOX_HEIGHT); boxes.add(new ABox(x, y)); } public void paintComponent(Graphics g) { // Always remember to call super.paintComponent super.paintComponent(g); for (int i=0; i<boxes.size(); ++i) { // We send the Graphics object for the panel into the draw function boxes.get(i).draw(g); }

Handle mouse clicks public void mouseClicked(MouseEvent e) {} public void mouseEntered(MouseEvent e) {} public void mouseExited(MouseEvent e) {} public void mouseReleased(MouseEvent e) {} public void mousePressed(MouseEvent e) { ABox whichBox = null; for (int i=0; i<boxes.size(); i++) { if (boxes.get(i).containsClick(e.getX(), e.getY())) { whichBox = boxes.get(i); break; } // display some information just to show whether a box was clicked if (whichBox != null) System.out.println(whichBox.getColor()); else System.out.println("Not a box!"); }

Now a JFrame public class MouseClickerMain { public static void main(String[] args) { // Notice we create a JFrame JFrame frame = new JFrame("Mouse Click Example"); MouseClickerPanel panel = new MouseClickerPanel(5); // Add the panel to the JFrame frame.setContentPane(panel); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); // Pack will determine size based on components frame.pack(); frame.setVisible(true); }