EventProgramming

(1)

(2)

Event Handling

• _{Java graphic components generate events}

– _{Buttons = when pressed, released, clicked}

– TextFields = when characters are types, enter key

– CheckBoxes = checked or unchecked

– _Etc…

• _{Based on these events we might want certain}

actions to happen

– _{Therefore we need to have code to detect these}

(3)

Button Example Code

private Scene scene; private Button button; @Override

public void start(Stage mainFrame) {

button = new Button("Ok");

scene = new Scene(button, 300, 300); mainFrame.setScene(scene);

(4)

(5)

Event Handling

• _{Currently nothing happens when the button is}

clicked

• We need to create an event handler

• _{Then we need to register the button with the}

(6)

Creating an Event Handler

1. Can create a private inner class

2. Can create an anonymous inner class 3. Can create a separate class

4. Can use Lambda Expressions

(7)

Private Inner Class

• _{This is a class inside your current class} • Advantages

– _{Can see all class variables}

– _{Will likely need to use them in the event handling} – _{Quick to code}

• Disadvantages

– _{For several different types of events and many}

(8)

Anonymous Inner Class

• This is a class created on-the-fly with no name

• Advantages

– _{Quick to code}

– _{Can be created inside the parameters for setting the}

event handler

• Disadvantages

– _{Only works for one components} – _{Ugly code}

(9)

Separate Event Handling Class

• _{Make separate classes for handling events} • Advantages

– Separates event handling from UI

– Makes programs more modular

• Disadvantages

– Much more work to code

– Does not have access to the UI components directly,

(10)

Lambda Expressions

• _{New to java 8}

• Cleaner way to create an anonymous inner class

• _Advantages

– _{Same as anonymous inner classes} – _{Looks nicer too}

• Disadvantages

(11)

When to Use a Private Inner Class

• _{Private Inner Classes}

– _{My preferred method}

– _{Have a lot of experience with this} – _{Never had a problem}

– The only method you really need to know

– _{Only reasons not to use}

• If you only have one or two buttons an anonymous inner class would be sufficient

(12)

When to Use an Anonymous Inner Class

• _{Anonymous Inner Class}

– _Never?

(13)

When to Use the Lambda Expression

• _{Only use if you have a very small number of}

components that need handlers

• The components should need separate handlers

(14)

When to Use a Separate Class

• _{Only use if you must separate UI from event}

handling

(15)

Example – ButtonHandlerExample1.java

(16)

Private Inner Class Button Handler

private class ButtonHandler implements EventHandler<ActionEvent> {

@Override

public void handle(ActionEvent e) {

if(e.getTarget() == button1) {

System.out.println("Button clicked"); }

(17)

Component Visibility

• _{Notice how the Button object was declared}

with class scope outside of the constructor

(18)

Component Visibility

private Scene scene;

private Button button;

@Override

scene = new Scene(button, 300, 300); mainFrame.setScene(scene);

(19)

Events

• _{There are many types of Event}

• In this case a button click corresponds to an ActionEvent

• _{Therefore our handler implements}

(20)

Event Type

private class ButtonHandler implements EventHandler<ActionEvent>

{

@Override

if(e.getTarget() == button) {

(21)

Handle Method

• _{All handlers must override the handle method} • Since we implement EventHandler we must

implement the handle method

• _{The handle method is what gets called when}

an event is detected

(22)

Handle Method

@Override

public void handle(ActionEvent e)

{

if(e.getTarget() == button) {

(23)

Implementing handle

• We should always check the source of the

event to know what component generated the event

• Always check the source even if there is only one component registered with the handler

– _{To ensure odd things don’t happen}

(24)

Handle Method

@Override

if(e.getTarget() == button)

{

(25)

getTarget Method

• _{All events have the getTarget method}

• This is basically returning the component that fired the event

• _{Use this to compare to the button you are}

looking for

(26)

Overview

• _{We have created a button}

• We have created the event handler class

• We have NOT created an event handler object

(27)

EventHandler Object

private ButtonHandler buttonHandler;

@Override

scene = new Scene(button, 300, 300);

buttonHandler = new ButtonHandler(); button.setOnAction(buttonHandler);

(28)

setOnAction Method

• _{All buttons have the method setOnAction} • This method is in the ButtonBase class

– _{Therefore all classes that inherit (directly or}

indirectly) from this class have this method

(29)

(30)

Anonymous Inner Class Example

@Override

button.setOnAction(new EventHandler<ActionEvent>(){ @Override

public void handle(ActionEvent e) { System.out.println("Button clicked"); } }); mainFrame.setScene(scene); mainFrame.show(); }

(31)

Example – ButtonHandlerExample2.java

(32)

Lambda Function Example

@Override

button.setOnAction((ActionEvent e) -> { System.out.println("Button clicked"); });

mainFrame.setScene(scene); mainFrame.show();

(33)

Example – ButtonHandlerExample3.java

(34)

Separate Event Handling Class

• _{Take your private inner class}

• Make it into a separate regular class

• Everything else should work similarly

• Note: if your event handler needs things in

your regular class, you need to create the event handler with an instance of your class

– _{Also need to proved get methods for the required}

(35)

Quick Summary

• _{Covered how to set up all event types of event}

handlers for a button

• From here on we will just use private inner classes

• We looked at how to handle a button click

(36)

Multiple Buttons

• _{Can register multiple buttons to a single}

handler

• _{Better than making a new handler for every}

(37)

Example – MultipleButtonsExample.java

(38)

(39)

Multiple Buttons Code

private class ButtonHandler implements EventHandler<ActionEvent>

{

@Override

if(e.getTarget() == button1)

{

System.out.println("Button 1 clicked"); }

else if(e.getTarget() == button2)

{

System.out.println("Button 2 clicked"); }

else if(e.getTarget() == button3)

(40)

Multiple Buttons

• _{Use the getTarget method to determine which}

one of the buttons has been clicked

• _{if(e.getTarget() == button1)}

• This allows for simpler code when multiple buttons can be registered to a single handler

(41)

Checkbox

• _{Checkboxes also use the setOnAction method}

to register a handler

• The handler is the same ActionEvent handler as regular buttons

• What makes Checkboxes different is the call e.getTarget()

(42)

Example – CheckBoxHandlerExample.java

(43)

CheckBox Code

@Override

checkBox1 = new CheckBox("Check Box 1"); checkBox2 = new CheckBox("Check Box 2"); checkBox3 = new CheckBox("Check Box 3");

checkBoxHandler = new CheckBoxHandler();

checkBox1.setOnAction(checkBoxHandler); checkBox2.setOnAction(checkBoxHandler);

(44)

CheckBox Code

private class CheckBoxHandler implements EventHandler<ActionEvent> {

@Override

if(e.getTarget() == checkBox1) {

System.out.println("Checkbox 1 clicked"); }

else if(e.getTarget() == checkBox2) {

System.out.println("checkBox 2 clicked"); }

else if(e.getTarget() == checkBox3) {

System.out.println("checkBox 3 clicked"); }

(45)

(46)

CheckBox Selected or Deselected

• _{Usually want to do something based on}

whether or not the checkbox was just selected or deselected

(47)

CheckBox Selected Code

@Override

if(e.getTarget() == checkBox1) {

if(checkBox1.isSelected()) {

System.out.println("Checkbox 1 selected"); }

else {

(48)

(49)

Radio Buttons

• _{These work the same way CheckBoxes do}

• Probably want to create a ToggleGroup object to add all the radio buttons to

– _{This has no impact on the handlers}

(50)

Example – RadioButtonHandlerExample.java

(51)

Radio Button Code

radioButton1 = new RadioButton("Radio Button 1"); radioButton2 = new RadioButton("Radio Button 2"); radioButton3 = new RadioButton("Radio Button 3");

radioButtonHandler = new radioButtonHandler();

(52)

Radio Button Code

private class RadioButtonHandler implements EventHandler<ActionEvent> {

@Override

if(e.getTarget() == radioButton1) {

System.out.println("Radio Button 1 selected"); }

else if(e.getTarget() == radioButton2) {

else if(e.getTarget() == radioButton3) {

(53)

(54)

ComboBox

• _{ComboBoxes also work the same was as all}

other buttons

• ComboBoxes also can use a ChangeListener

(55)

Example – ComboBoxHandlerExample.java

(56)

ComboBox Code

comboBox1 = new ComboBox();

comboBox1.getItems().addAll("Choice 1", "Choice 2", "Choice 3");

comboBox1.setMaxWidth(Double.MAX_VALUE); comboBox1.setVisibleRowCount(10);

(57)

ComboBox Code

@Override

if(e.getTarget() == comboBox1) {

System.out.println("ComboBox 1 choice " +

(comboBox1.getSelectionModel().getSelectedIndex() + 1) + " selected");

(58)

ComboBox Methods

• _{comboBox1.getSelectionModel()}

– _{This method returns the selection model}

• _{getSelectedIndex()}

– _{Returns the index of the ComboBox choice selected}

• _{Can also get the selected item}

(59)

(60)

ChangeListener

• ChangeEvents for detecting changes

• Different from ActionEvents

• Need another handler to listen for these

• _{Need to register the ComboBox to this listener}

too

• Used for when we just want to detect the state has changed

(61)

ComboBox ChangeListener Code

comboBoxHandler2 = new ComboBoxHandler2();

comboBox1.valueProperty().addListener(comboBoxHan dler2);

This adds a Listener to the comboBox

This is generic for all listeners for the ComboBox

(62)

ComboBox ChangeListener Code

private class ComboBoxHandler2 implements ChangeListener<String> {

@Override

public void changed(ObservableValue<? extends String> o, String from, String to) {

System.out.println("Changed from " + from + " to " + to); }

(63)

(64)

ComboBox Events

• Notice how choosing a choice fired both an action event and a change event

(65)

TextField

• _{TextFields have two main types of events}

(66)

Example – TextHandlerExample.java

(67)

TextField ActionEvent Code

• _{textHandler2 = new TextHandler2();} • textField1.setOnAction(textHandler2);

• This adds textHandler2 as an ActionEvent listener

(68)

TextField ActionEvent Code

private class TextHandler2 implements EventHandler<ActionEvent> {

@Override

if(e.getTarget() == textField1) {

System.out.println(textField1.getText()); }

(69)

(70)

KeyEvent

• _{Can listen events for keys}

– _{KeyPressed = when a key is pushed down}

• _{setOnKeyPressed()}

– _{KeyReleased = when a key is let back up}

• _{setOnKeyReleased()}

– _{KeyTyped = when a key is pressed and released}

(71)

KeyEvent Code

textHandler = new TextHandler();

(72)

KeyEvent Code

private class TextHandler implements EventHandler<KeyEvent>

{

@Override

public void handle(KeyEvent e) {

if(e.getTarget() == textField1) {

if(e.getEventType() == KeyEvent.KEY_PRESSED) {

System.out.println(e.getText() + " Pressed"); }

else if(e.getEventType() == KeyEvent.KEY_RELEASED) {

System.out.println(e.getText() + " Released"); }

else if(e.getEventType() == KeyEvent.KEY_TYPED) { System.out.println(e.getText() + " Typed");

(73)

getEventType()

• _{In this example the same handler is set to}

listen to three events

– _{KeyEvent.KEY_PRESSED} – _{KeyEvent.KEY_RELEASED} – _{KeyEvent.KEY_TYPED}

(74)

(75)

KeyEvent

• _{Can also detect certain keys} • KeyEvent class methods

– _{getCode = returns the key code}

– _{getText = returns the text of the key}

(76)

MouseEvent

• Components can listen for various MouseEvents

• MouseEvent

– MOUSE_CLICKED

• when the mouse is pressed and released

– MOUSE_PRESSED

• when the mouse is pressed

– MOUSE_RELEASED

(77)

MouseEvent

• _MouseEvent

– MOUSE_MOVED

• _{when the mouse moves inside a component}

– _{MOUSE_ENTERED}

• _{when the mouse enters a component}

– _{MOUSE_EXITED}

• when the mouse exits a component

– _{MOUSE_DRAGGED}

(78)

MouseEvent

• _{Can have any node listen for mouse events}

– _Labels

– _TextFields – _Shapes

– Buttons

(79)

Functions – Node class

• _{setOnMouseClicked} • setOnMouseDragged

• setOnMouseEntered

• setOnMouseExited

• setOnMouseMoved

• setOnMousePressed

(80)

Example – MouseHandlerExample.java

(81)

Adding Handlers Code

label1 = new label("Click Here");

mouseHandler = new MouseHandler();

(82)

MouseEvent Handler

private class MouseHandler implements EventHandler<MouseEvent>

{

@Override

public void handle(MouseEvent e) {

if(e.getTarget() == label1) {

(83)

MouseEvent Functions

• _getButton()

– _{Determine which mouse button was clicked}

• _getScreenX()

– _{X position the mouse was clicked at}

• _getScreenY()

(84)

MouseButton

• _{Class has constants to compare the mouse button to}

– _{PRIMARY = primary mouse button (usually left)}

– SECONDARY = secondary mouse button (usually right) – _{MIDDLE = middle mouse button}

(85)

MouseHandler Code

if(e.getButton() == MouseButton.PRIMARY)

{

if(e.getEventType() == MouseEvent.MOUSE_PRESSED) {

System.out.println("Left Mouse Pressed"); }

else if(e.getEventType() == MouseEvent.MOUSE_RELEASED) {

System.out.println("Left Mouse Pressed"); }

(86)

(87)

Logic Note

• _{It might be possible to have a released event}

without a pressed event

– _{Click in one node}

– _{Do not released the mouse} – _{Move into another node} – _{Release the mouse}

– _{Try this and see what happens.}

(88)

Restructure Code For more Events

• _{Check for the source}

– _{if(e.getTarget() == label1)}

• _{Check for the event type}

– if(e.getEventType() == MouseEvent.MOUSE_PRESSED)

• Check for the button type (if applicable)

(89)

More Mouse Handling Code

else if(e.getEventType() == MouseEvent.MOUSE_CLICKED) {

if(e.getButton() == MouseButton.PRIMARY) { System.out.println("Left Mouse Clicked"); }

else if(e.getButton() == MouseButton.SECONDARY) {

(90)

(91)

(92)

Event Process

• _{Target Selection}

• Route Construction

• Event Capturing

(93)

Target Selection

• _{Determine which node fired the event}

(94)

Target Selection Example

• _{Clicking on the triangle will choose the}

(95)

Route Construction

• _{Initial route determined by event dispatch}

chain

• Initial route can be modified by

– _{Event filters}

– _{Event Handlers}

(96)

Route Construction Example

(97)

Event Capturing

• _{Event flows along the event dispatch chain} • If there are any nodes that have filters, those

filters are called

– _{Filters are the same as handlers}

– _{They capture things on the way down the chain}

• _{Can consume the event and stop the event flow}

• _{Event reaches the bottom of the chain and the}

(98)

Event Bubbling

• _{Once the event is processed it returns back up}

the chain of events

• _{The event is processed by any registered}

(99)

Example

• _{Register filter for rectangle} • Register handler for triangle

(100)

Example

• _{When I click on the triangle the following}

happens

• _{Event filter for rectangle is executed}

(101)

Example 2

• _{Register filter for rectangle}

– _{Consume the event in the filter}

(102)

Example

• _{When I click on the triangle the following}

happens

• _{Event filter for rectangle is executed} • Event is consumed

(103)

Event Chain Reference

• _http://

(104)

When to Consume Events

• _Scenario

– _{You have one component that contains another}

• _{Let component x contain component y}

– _{Both components listen for button clicks} – _{You click on component y}

– _{You do not want the event handler for component}

x to execute

– _{You should consume the event in the event handler}

http://docs.oracle.com/javafx/2/events/processing.htm