GWT UiBinder: Add Mouse Handler to Panel or Grid

Question

I can't find a way to add a Mouse Handler to a GWT Panel or a Grid while using UiBinder.

I basically need a way that I can detect the following over a Grid:

1. Detect what cell the event is happening in.
2. Detect Mouse Up Event
3. Detect Mouse Down Event
4. Detect Mouse Out Event
5. Detect Mouse Over Event

I had planned to try and do this with the absolute panel overlayed on top of the Grid. I could detect these events on the AbsolutePanel, then based off of the location of the event, determine what cell the event would have taken place in had the AbsolutePanel not have been overlayed on top of the Grid, and then act accordingly. I now find out that the exact same restrictions are placed upon the panels in terms of click handlers, and don't have many options.

I just need to find a way to get the above events to work on the Grid. What would you recommend? Not using UiBinder, I was using DomHandlers, which seem to be disabled in UiBinder (am I wrong?).

Any help is VERY appreciated. Thanks!

~Scott

Answer 1

You could extend Grid and have it implement appropriate interfaces like:

public class ClickableGrid extends Grid implements HasMouseDownHandlers {
     ...
    public HandlerRegistration addMouseDownHandler(MouseDownHandler handler) {
        return addDomHandler(handler, MouseDownEvent.getType());
    }

}

and then use it in template

<my:ClickableGrid ui:field="clickableGrid">

and add handler in owning class

@UiHandler("clickableGrid")
    void handleClick(MouseDownEvent event) {
...
}

Hope it helps.

Answer 2

...or simply place the Grid inside a FocusPanel:

public class MouseGrid extends Composite {

    public MouseGrid() {
        Grid grid = new Grid(3, 3);
        for (int row = 0; row < 3; ++row) {
            for (int col = 0; col < 3; ++col) {
                grid.setText(row, col, "" + row
                        + ", "
                        + col);
            }
        }
        FocusPanel panel = new FocusPanel();
        panel.setWidget(grid);
        initWidget(panel);
        panel.addMouseDownHandler(new MouseDownHandler() {

            @Override
            public void onMouseDown(MouseDownEvent event) {
                Window.alert("mouse down");
            }
        });
    }
}