Click here to Skip to main content
Click here to Skip to main content

Implementing Mouse Gestures in Java Swing: Step by Step

, 29 Jun 2008
Rate this:
Please Sign up or sign in to vote.
A step by step guide to implement Mouse Gestures based commands in your Swing applications

Introduction - Mouse Gestures

Mouse Gestures is a way to uniquely combine mouse clicks and subsequent mouse movements that would be interpreted as specific commands for the current application. A simple mouse gesture that you must be aware of is a mouse "drag", where you click on a particular object and move your mouse, keeping your mouse clicked, till a particular point. This might be interpreted by the application (or the OS), as a command, for example, to move the object from its source location to the location where the mouse was finally released.

Although, "dragging" is the most common type of mouse gesture, there are other types of mouse gestures. eg., in the Opera Browser, you can hold the right mouse button and move the mouse left to go to the previous page in the browser history.

Evidently, mouse gestures are cool, and lets your application users execute a command, without having them to take their hands out of the mouse into the keyboard.

This article explains how to implement such a mouse gesture in Java Swing, step by step. For more such tips and articles, click here.

Implementing Mouse Gestures in Java Swing

There are many Software libraries available in Java that will let you do this. The two most famous ones are iGesture and Smardec's Mouse Gestures.
In this article, let's discuss about one of these: the Smardec's "Mouse Gestures".

What Should You Be Able to Recognize?

To implement mouse gestures, the minimum you should be able to recognize are these:

While holding one of the mouse keys down(left, right or center), the user

  1. Moves the mouse down (Let's call it operation 'D')
  2. Moves the mouse up(Operation 'U')
  3. Moves the moue right (Operation 'R')
  4. Mouse the mouse left (Operation 'L')

Once your library allows you to do these, you can use a series of them to make your one command. For eg., a set of commands "DR"(down and then right), can be a command, that makes the user draw a command that looks like the alphabet 'L'.

Getting Practical: Recognizing the Mouse Gesture

Ok, enough theory. Let's write code. But before that, let's settle on a gesture that we need to track. Our simple application will be a blank form, with a label, where the user can make mouse gestures. When he makes a gesture as below, while holding the right mouse button we interpret it as a command, and show a message in the label.

mouseGestureArrow.JPG

Clearly, this command occurs in the order D,R,U while holding the right mouse button.

The Application

We will define how our application will look here.

  1. Initially, our application will look like this:

outputStart.JPG

  1. When the user is in the middle of doing a 'DRU' (for drawing a 'U' on the screen):

outputWhenCorrect.JPG

  1. When the user does something wrong:

outputWhenWrong.JPG

  1. When the user has successfully completed making a 'U':

outputWhenFinished.JPG

The Code

Step 1: Get the Jar

  1. Download the "Mouse Gestures" jar file from here
  2. Unzip it and add the dist/mousegestures-1.2.jar file to your classpath

Step 2: Write the Code

  1. Create an instance of the MouseGestures class:

       MouseGestures mouseGestures = new MouseGestures();
  2. Make sure that you listen to the right mouse button:

         mouseGestures.setMouseButton(MouseEvent.BUTTON3_MASK);

    Similarly, You can use BUTTON1_MASK, BUTTON2_MASK for the center and left mouse buttons

  3. Add a MouseGesturesListener and write your code. See comments in the code for explanation.

    Add the mousegesture listener, that has code that process displays appropriate commands:

    mouseGestures.addMouseGesturesListener(new MouseGesturesListener() { 

    Override the gestureMovementRecognized and write your code. The currentGesture will be a string representing the short abbreviation of the current set of mouse gestures. For example, if the current user gesture is down and then right, then the currentGesture will have DR.

        public void gestureMovementRecognized(String currentGesture) {
            if("DRU".equals(currentGesture)){
                label.setText("    "  + currentGesture + " - 
                          Wow, U have drawn 'U'");
            }
            else if("DRU".startsWith(currentGesture)){
                label.setText("    "  + currentGesture + " - 
                              You need to make a DRU");
            } 
            else{
                label.setText("    "  + currentGesture + " - 
                              Wrong gesture! release your mouse and try again");
            } 
        } 
    //This method is called when the user releases the mouse button finally
    //Just display the current message for a few milliseconds then
    //redisplay the original text
        public void processGesture(String gesture) {
            try { 
                Thread.sleep(400);
            } catch (InterruptedException e) {}
            label.setText(text);
        } 
     }); 
  4. Start the mouseGesture:

       mouseGestures.start();

References

History

  • 29th June, 2008: Initial post

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

No Biography provided

Comments and Discussions

 
GeneralRobot class PinmemberSurendra Sambana29-Jun-08 10:50 
GeneralGood start PinmemberDerek Bartram29-Jun-08 9:45 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web04 | 2.8.140718.1 | Last Updated 29 Jun 2008
Article Copyright 2008 by kaushik_sathupadi
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid