GWT UiHandler on HTMLPanel

Question

I'm writing a widget with the following markup:

<g:HTMLPanel ui:field="shortcutPanel" styleName="{style.shortcut}">
    <g:Image ui:field="shortcutImage"></g:Image>
    <span ui:field="shortcutLabel"></span>
</g:HTMLPanel>

So essentially a div that wraps and image and a label. Now, instead of adding the event handlers on the image/span, I'd like an onClick to be associated with the HTMLPanel. My problem however is that gwt tells me that

shortcutPanel doesn't not have an addClickHandler method associated

So I'm assuming the difference is that HTMLPanel doesn't implement HasClickHandlers or something along that line. I'm wondering then what is the standard way to attach a click handler to a Ui element such as an HTMLPanel or even better, is there such a GWT Widget that is essentially a div wrapper that I can easily attach events to with the @UiHandler annotation.

Answer 1

I haven't done this before, but you could do the following -

• Create a custom class MyPanel that extends HTMLPanel and implements HasClickHandlers

• Add the following method in MyPanel.java

  public HandlerRegistration addClickHandler(ClickHandler handler) { return addDomHandler(handler, ClickEvent.getType()); }

• Then replace HTMLPanel with MyPanel in your ui.xml and its corresponding java implementation.

You can always look at the implementation of HTMLTable to get an understanding of how the event propagation works. Its a Panel, and implements HashClickHandlers.

Answer 2

You are probably looking for FocusPanel - it has all the goodies: HasAllFocusHandlers, HasAllKeyHandlers, HasAllMouseHandlers, HasBlurHandlers, HasClickHandlers.... to name a few :) I find it to be the easiest and best way to attach click handlers to a Panel.