How to make a hourglass pointer?

[tong123123]

For lengthy process, I want to set the mouse pointer to hourglass, how to do it in GWT?

[Jens]

You have to set the CSS rule "cursor:wait" or "cursor:progress" on the element where the mouse cursor should be changed. If it should change for the whole site, you would add it to the body tag (accessible through RootPanel.get()) or to a glasspane like div that you maybe already have for disabling all mouse events.

-- J.

[Kei Kei]

I use the following code

public class ShowHourGlass extends FlowPanel {
   
    Button showHourGlass = new Button("Show HourGlass");
   
    protected void onLoad(){
        this.add(showHourGlass);
        showHourGlass.addClickHandler(new ClickHandler(){

            @Override
            public void onClick(ClickEvent event) {
                //showWaitCursor();
                RootPanel.get().setStyleName("waitCursor");
                Timer t = new Timer() {
                      public void run() {
                        // do something after a delay
                          //showDefaultCursor();
                        RootPanel.get().setStyleName("defaultCursor");
                      }
                    };
                // delay running for 1 seconds
                t.schedule(1000);
            }
           
        });
    }
}

and the css is as follow:

 
.waitCursor{
    cursor:wait;
}

.defaultCursor{
    cursor:default;
}

 
and found some problem,
1) after click the button and move the mouse cursor away from the button and then stay (not move), the cursor will change to wait but will not change back to default, I need to move the cursor to make it return to default state.
2) even I keep moving the mouse cursor, I found the time to return to default cursor is longer than 1 sec even I set

t.schedule(1000);

 3) If the mouse cursor not leave the button, the cursor is still in hand shape and the user can continue click the button many times.

how to solve the above problem?

 

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.

To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/gdov4VIG5Q4J.

To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.

[pop.ionut84]

Why don't you display a "Please Wait" popup for the lengthy process? You can add to that popup an animated gif and message.

[Jens]

 3) If the mouse cursor not leave the button, the cursor is still in hand shape and the user can continue click the button many times.

The cursor is still a hand because buttons, links, ... have their own curser css rule. You would have to change these as well. Also you can still click the button because you only change the appearance of the curser.

If you want to block all mouse input and you want a globally visible hour glass curser you need a glass pane which lies above your web application. 

You can use PopupPanel with enabled glass pane for this and apply your css rule for the cursor to the glass pane.

-- J.