How to add event handlers to composite panels in GWT 1.6

Question

This is probably a really simple thing, but I don't know how to implement the following.

package mods.client.resultSelector;

import com.google.gwt.event.dom.client.MouseDownEvent;
import com.google.gwt.event.dom.client.MouseDownHandler;
import com.google.gwt.user.client.ui.AbsolutePanel;
import com.google.gwt.user.client.ui.Composite;

public class MousyAbsolutePanel extends Composite implements MouseDownHandler {

    AbsolutePanel abs = new AbsolutePanel();

    public MousyAbsolutePanel(int width){
     System.out.println("MousyAbsolutePanel being created with width:" + width);
     initWidget(abs);
     abs.setWidth(String.valueOf(width));
     abs.setHeight("100%");
     abs.setStyleName("mousyAbsolutePanel");
    }

    public void onMouseDown(MouseDownEvent event) {
     System.out.println("onMouseDown()");
    }

}

I want to have what is effectively a absolutePanel that can accept mouse events. However, within the Composite object I don't know how to tie the the handler I have written (the onMouseDown() thing) with the abs variable. To put it succinctly, I want the abs AbsolutePanel to respond when it is clicked upon, but AbsolutePanels do not naturally accept click events. How do I go about doing this?

Apologies in advance if this is stupid simple, but I just don't quite know how to implement this behavior, and I have not seen it mentioned in the searches I have done.

Answer 1

The best thing to do for learning how/what to do is to look at an example. E.g., the FocusWidget class (which implements HasClickHandlers).

Specifically, look at the addClickHandler() method, and trace it through.

Answer 2

In this case, extending the Composite is probably not the best idea unless you're deliberately blocking access to the AbsolutePanel you create in the constructor. If you extend the AbsolutePanel you'll be able to reuse the code to add/remove widgets etc..

Here's how I'd recommend you do it:

package mods.client.resultSelector;

import com.google.gwt.event.dom.client.MouseDownEvent;
import com.google.gwt.event.dom.client.MouseDownHandler;
import com.google.gwt.event.dom.client.HasMouseDownHandlers;
import com.google.gwt.user.client.ui.AbsolutePanel;


public class MousyAbsolutePanel extends AbsolutePanel implements
                         MouseDownHandler,HasMouseDownHandlers {

    public MousyAbsolutePanel(int width) {
        System.out.println("MousyAbsolutePanel being created with width:" + width);

        this.setWidth(String.valueOf(width));
        this.setHeight("100%");
        this.setStyleName("mousyAbsolutePanel");

        this.addMouseDownHandler(this);
    }

    /** 
     * MouseDownHandler
     */
    public void onMouseDown(MouseDownEvent event) {
        System.out.println("onMouseDown()");
    }

    /**
     * HasMouseDownHandlers - Code to add handlers to the panel
     */  
    public HandlerRegistration addMouseDownHandler(MouseDownHandler handler) {
         return addDomHandler(handler, MouseDownEvent.getType());
    }

}

Then you can access MousyAbsolutePanel the same way you access an AbsolutePanel, but with the additional event handlers, style etc..

Answer 3

Once you call initWidget(Widget), Composite will correctly proxy the event registration. So, you can just call MousyAbsolutePanel's inherited addDomHandler(...).

Answer 4

And what if I extended Composite instead of AbsolutePanel in the previous example, would it be necessary then to unregister all the objects which called MousyAbsolutePanel.addMouseDownHandler(someObjectFromOutside) in onUnload() method and register them again in onLoad() method to avoid circular references causing memory leaks?

I am not sure when this must be done, I have not found any clear explanation despite the fact that I googled a lot.