Lesson: Adding Keyboard Support to the Editor

In order to enable keyboard support for the view of our editor type application, we need the Graph2DViewActions class. Let's add the code shown in Example 1.3, “Adding Graph2DViewActions to the view” to SimpleGraphEditor1, creating SimpleGraphEditor2.

Example 1.3. Adding Graph2DViewActions to the view

// Creating and installing keyboard actions for the view.
new Graph2DViewActions(view).install();

Example 1.4, “createGraph2DView method of SimpleGraphEditor2” shows the new createGraph2DView method with the above code incorporated.

Example 1.4. createGraph2DView method of SimpleGraphEditor2

private Graph2DView createGraph2DView() {
  Graph2DView view = new Graph2DView();
  
  // Add a mouse wheel listener to zoom in and out of the view.
  view.getCanvasComponent().addMouseWheelListener(
    new Graph2DViewMouseWheelZoomListener());
  
  // Add the central view mode for an editor type application.
  editMode = new EditMode();
  view.addViewMode(editMode);
  
  // Creating and installing keyboard actions for the view.
  new Graph2DViewActions(view).install();
  
  return view;
}

After we have "installed" the Graph2DViewActions, our application now has a working DELETE key, which we can use to delete selected graph elements. Also, using the F2 function key, we can edit the label of selected graph elements, and if we want to, by pressing CONTROL-A we can select all nodes and bends, or all edges when there is an edge selected at first.

Further keyboard support that is enabled covers graph element navigation: navigating nodes is possible using the cursor keys, navigating edges needs a selected edge at first, the cursor keys, and additionally the ALT modifier key.

Note

Actually, Graph2DViewActions not only adds keyboard support. In fact, it also provides a number of predefined Action implementations to handle hierarchy-related user interaction (of course, these implementations also have keyboard short-cuts). We will make use of some of them in the next lesson...

Related Resources

You will find related information in the yFiles for Java Developer's Guide:

In the yFiles for Java API:

In the yFiles for Java source code demos: