JavaFX Keyboard Event Propagation
This is an examination of keyboard event propagation. As in a previous example, the code for this has EventFilters and EventHandlers registered for various user interface objects which simply print to the console when they have been called. This allows the motion of the event through the various filters and handlers to be observed.
The GitHub link for the code is: https://github.com/cajanssen/JavaFXKeyEventPropagation.git
If additional help is needed to pull the code into Eclipse and set up a JavaFX project, some information to this effect is available in a previous post.
To reiterate what was said before: The user interface is a nested tree, user interface events will occur within the visual bounding area of more than one object (i.e. the topmost object, its parent, its grandparent, etc.). These events will propagate through the tree (scene graph) such that all the relevant objects have a chance at reacting to them. The user interface objects can have EventHandler objects attached to them in two ways: via Event filters and via Event handlers. The difference between these two is when they execute. Events propagate down the tree from the top in what is called the capturing phase. Event filters are called during this time. When the bottom of the tree is reached, the Event propagates back up the tree in what is called the bubbling phase. Event handlers are called during this time. Event propagation can be halted at any time by calling consume() on the actual Event in the handler code.
Javadocs for the JavaFX classes can be found here: https://openjfx.io/javadoc/13/allclasses-index.html
Example code:
package jansproj.basicfx;
import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.Menu;
import javafx.scene.control.MenuBar;
import javafx.scene.control.MenuItem;
import javafx.scene.control.TextArea;
import javafx.scene.input.KeyCode;
import javafx.scene.input.KeyEvent;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class KeyEventPropagationApp extends Application
{
public KeyEventPropagationApp()
{
// TODO Auto-generated constructor stub
}
@Override
public void start(Stage stage) throws Exception
{
stage.setTitle("Key Event Propagation");
VBox root = new VBox();
HBox colBox = new HBox();
VBox cola = new VBox();
Label colaLaba = new Label("Column A");
// uncomment this to enable focus on this Label
//colaLaba.setFocusTraversable(true);
Button colaButta = new Button("Column A");
TextArea colaText = new TextArea();
VBox colb = new VBox();
Label colbLaba = new Label("Column B");
Button colbButta = new Button("Column B");
TextArea colbText = new TextArea();
Scene scene = new Scene(root);
MenuBar menubar = new MenuBar();
MenuItem mia = new MenuItem("Item A");
MenuItem mib = new MenuItem("Item B");
MenuItem mic = new MenuItem("Item C");
MenuItem mid = new MenuItem("Item D");
MenuItem mie = new MenuItem("Item E");
MenuItem mif = new MenuItem("Item F");
MenuItem mig = new MenuItem("Item G");
MenuItem mih = new MenuItem("Item H");
MenuItem mii = new MenuItem("Item I");
Menu ma = new Menu("Menu A");
Menu mb = new Menu("Menu B");
Menu mc = new Menu("Menu C");
ma.getItems().addAll(mia, mib, mic);
mb.getItems().addAll(mid, mie, mif);
mc.getItems().addAll(mig, mih, mii);
menubar.getMenus().addAll(ma, mb, mc);
root.getChildren().add(menubar);
root.getChildren().add(colBox);
colBox.getChildren().add(cola);
cola.getChildren().add(colaLaba);
cola.getChildren().add(colaButta);
cola.getChildren().add(colaText);
colBox.getChildren().add(colb);
colb.getChildren().add(colbLaba);
colb.getChildren().add(colbButta);
colb.getChildren().add(colbText);
scene.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("Scene KeyPressed handler keycode= " + keyCode);
}});
scene.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("Scene KeyPressed filter keycode= " + keyCode);
}});
root.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("root (VBox) KeyPressed handler keycode= " + keyCode);
}});
root.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("root (VBox) KeyPressed filter keycode= " + keyCode);
}});
menubar.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("menubar (MenuBar) KeyPressed handler keycode= " + keyCode);
}});
menubar.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("menubar (MenuBar) KeyPressed filter keycode= " + keyCode);
}});
ma.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("ma (Menu) KeyPressed handler keycode= " + keyCode);
}});
mb.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("mb (Menu) KeyPressed handler keycode= " + keyCode);
}});
mc.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("mc (Menu) KeyPressed handler keycode= " + keyCode);
}});
cola.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("cola (VBox) KeyPressed handler keycode= " + keyCode);
}});
cola.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("cola (VBox) KeyPressed filter keycode= " + keyCode);
}});
colaLaba.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaLaba (Label) KeyPressed handler keycode= " + keyCode);
}});
colaLaba.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaLaba (Label) KeyPressed filter keycode= " + keyCode);
}});
colaButta.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaButta (Button) KeyPressed handler keycode= " + keyCode);
}});
colaButta.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaButta (Button) KeyPressed filter keycode= " + keyCode);
}});
colaText.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaText (TextArea) KeyPressed handler keycode= " + keyCode);
}});
colaText.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colaText (TextArea) KeyPressed filter keycode= " + keyCode);
}});
colb.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colb (VBox) KeyPressed handler keycode= " + keyCode);
}});
colb.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colb (VBox) KeyPressed filter keycode= " + keyCode);
}});
colbLaba.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbLaba (Label) KeyPressed handler keycode= " + keyCode);
}});
colbLaba.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbLaba (Label) KeyPressed filter keycode= " + keyCode);
}});
colbButta.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbButta (Button) KeyPressed handler keycode= " + keyCode);
}});
colbButta.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbButta (Button) KeyPressed filter keycode= " + keyCode);
}});
colbText.addEventHandler(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbText (TextArea) KeyPressed handler keycode= " + keyCode);
}});
colbText.addEventFilter(KeyEvent.KEY_PRESSED,
new EventHandler<KeyEvent>() {
public void handle(KeyEvent e) {
KeyCode keyCode = e.getCode();
System.out.println("colbText (TextArea) KeyPressed filter keycode= " + keyCode);
}});
stage.setScene(scene);
stage.show();
}
public static void main(String[] args)
{
launch(args);
}
}
Note that due to the redundancy in this code, it is compressed and formatted less explicitly than might be expected.
So routing of keyboard events is less straightforward than mouse events. With a mouse event, it is usually pretty clear where it happened and, by extension, which user interface elements are involved by virtue of their location. A keystroke is not necessarily tied to particular location in the window that is displayed. Which UI elements get notified of the event will change depending upon what elements are in the window, which element has focus and also what type of keystroke occurred.
Upon executing the application, it can be seen that the initial focus is on the Column A Button. Pressing a regular letter key shows the event passing through the order of scene filter, root filter, cola filter, cola button filter, cola button handler, cola handler, root handler and scene handler. (Although, if the object hierarchy creation is examined, it would be noticed that colbox would also be in the chain but no handlers or filters have been added for it.)
If the Return key is pressed, the focus is still on the Column A Button and the button apparently consumes the key event at its handler, since the event makes it down the filter chain and ends at the Column A Button handler.
Clicking on other objects such as the Column B Button or the TextAreas causes the key events to route to these objects instead. It can be noticed that the TextArea will consume the Arrow key events as well as the Return key events.
The arrow keys can be used to change object focus as well, as long as the current focused object does not consume the event.
Also note Labels don't receive navigation focus by default. This is because their focusTraversable property is set to "false" by default. This can be changed by calling the setFocusTraversable() method on the individual Label objects (inherited from the Node object). Labels still won't receive focus by being clicked upon, however.
Finally, the MenuBar. While you can add Filters and Handlers, they don't seem to be called. However, pressing ALT apparently wakes up the MenuBar which then consumes Arrow key events and ignores other key events until Return, which puts it away again.
Because of the many permutations of which object has focus and which key is causing the event, this code is just a jumping off point for exploring keyboard event routing.
No comments:
Post a Comment