Question

I have a situation where I want something to be displayed when a user clicks on something in my UI (can be a grid, label, whatever). What I want is for a little box to be displayed that’s similar to what’s shown when a hover event is triggered. However, I only want to show it on a click, not a hover. Is there a way to do this without a lot of trouble? I know I could always create a little pop up Window but the hover text is exactly what I need and handles the location of the popup intelligently (which I think would take a good deal more work using a Window).

Answer 1

I don’t think there’s a simple way to do this. Here’s the smart popup class we use:

public class SmartPopup extends PopupPanel {

    public void show(int left, int top) {
        setPopupPositionAndShow(new PositionCallback() {
            @Override
            public void setPosition(int offsetWidth, int offsetHeight) {
                int popupLeft = left;
                if ((offsetWidth + left > Window.getClientWidth())
                    && (left - offsetWidth > 0)) {
                    popupLeft = left - offsetWidth;
                }

                int popupTop = top;
                if ((top + offsetHeight > Window.getClientHeight())
                    && (top - offsetHeight > 0)) {
                    popupTop = top - offsetHeight;
                }

                setPopupPosition(popupLeft, popupTop);
            }
        });
    }
}

Once you have a class like that, you could extend it to have your tool-tip styles, automatically include a label, etc…

public class ToolTip extends SmartPopup {
    public ToolTip(String message) {
        addStyleName("tool-tip-css");
        add(new Label(message));
    }
}

And then, from there your code will be pretty simple:

yourButtonOrWhatever.addClickHandler(new ClickHandler() {

        @Override
        public void onClick(ClickEvent event) {
            ToolTip toolTip = new ToolTip("Hey, this is like a tool-tip for clicking!");
            toolTip.show(event.getClientX(), event.getClientY());
        }
    });

I love writing classes so much that I’d probably even make a special subclass of ClickHandler so I didn’t have to type those lines over and over again…

yourButtonOrWhatever.addClickHandler(new ToolTipHandler("Hey, this is like a tool-tip for clicking!"));