Java 将 MouseOverHandler 添加到元素？

Adding a MouseOverHandler to an Element?

提问by JP Richardson

I would like to listen for the mouse over event in GWT 1.6. Since GWT 1.6 has introduced handlers and deprecated listeners I'm unsure as to how I can accomplish this with what little information exists.

我想在 GWT 1.6 中监听鼠标悬停事件。由于 GWT 1.6 引入了处理程序和不推荐使用的侦听器，我不确定如何利用现有的少量信息来完成此任务。

Note: I have an Element object. That's what I need to add the mouse handler to. I apologize for my lack of clarity.

注意：我有一个 Element 对象。这就是我需要添加鼠标处理程序的内容。我为我的不清楚而道歉。

Thanks!

谢谢！

采纳答案by CoverosGene

I was hoping we'd see an answer before I needed to tackle this myself. There are some errors in the example code he posted, but the post by Mark Renouf in this threadhas most of what we need.

在我需要自己解决这个问题之前，我希望我们能看到答案。他发布的示例代码中存在一些错误，但Mark Renouf 在此线程中的帖子包含了我们需要的大部分内容。

Let's say you want to listen for mouse over and mouse out events on a custom widget. In your widget, add two methods:

假设您想侦听自定义小部件上的鼠标悬停和鼠标移出事件。在您的小部件中，添加两个方法：

public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
  return addDomHandler(handler, MouseOverEvent.getType());
}

public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
  return addDomHandler(handler, MouseOutEvent.getType());
}

Then create a handler class:

然后创建一个处理程序类：

public class MyMouseEventHandler implements MouseOverHandler, MouseOutHandler {
  public void onMouseOver(final MouseOverEvent moe) {
    Widget widget = (Widget) moe.getSource();
    widget.addStyleName("my-mouse-over");
  }

  public void onMouseOut(final MouseOutEvent moe) {
    Widget widget = (Widget) moe.getSource();
    widget.removeStyleName("my-mouse-over");
  }
}

Finally, add the handler to the widget:

最后，将处理程序添加到小部件：

myWidget.addMouseOverHandler(new MyMouseEventHandler());
myWidget.addMouseOutHandler(new MyMouseEventHandler());

If you are only listening to the mouse over event, you can skip the mouse out handling. And if you aren't making a custom widget, the widget my already have a method to add the handler.

如果您只监听鼠标悬停事件，则可以跳过鼠标移出处理。如果您不制作自定义小部件，则小部件我已经有了添加处理程序的方法。

Finally, per the warning from the thread, remember to addDomHandlerfor the mouse events, not addHandler.

最后，根据线程的警告，请记住addDomHandler为鼠标事件，而不是addHandler.

回答by hannson

You'd want to implement these interfaces in your class:

你想在你的类中实现这些接口：

• HasMouseOverHandlers
• HasMouseOutHandlers
• MouseOverHandler
• MouseOutHandler

• HasMouseOverHandlers
• HasMouseOutHandlers
• 鼠标悬停处理程序
• 鼠标输出处理程序

MouseOverEvent is fired when the mouse enters the element, and MouseOutEvent is fired when it's no longer over.

MouseOverEvent 在鼠标进入元素时触发，MouseOutEvent 在元素不再结束时触发。

HasMouseOverHandleris implemented like this:

HasMouseOverHandler是这样实现的：

public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
    return addDomHandler(handler, MouseOverEvent.getType());
}

HasMouseOutHandleris implemented like this:

HasMouseOutHandler是这样实现的：

public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
    return addDomHandler(handler, MouseOutEvent.getType());
}

After that you just handle the events with a MouseOverHandler and MouseOutHandler, should be pretty straightforward after that.

之后，您只需使用 MouseOverHandler 和 MouseOutHandler 处理事件，之后应该非常简单。

If you want to add an EventHandler to an Element that already exists in the HTML the only idea I've come up with is creating a wrapper class. This is completely untested.

如果你想将一个 EventHandler 添加到一个已经存在于 HTML 中的元素，我想出的唯一想法是创建一个包装类。这是完全未经测试的。

class ElementWrapper extends UIObject implements HasMouseOverHandlers, 
HasMouseOutHandlers
{
     public ElementWrapper(Element theElement)
     {
        setElement(theElement);
     }   

    public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
        return addDomHandler(handler, MouseOutEvent.getType());
    }

    public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
        return addDomHandler(handler, MouseOverEvent.getType());
    }
}

Then you could get an existing Element from the HTML and initialize like this:

然后你可以从 HTML 中获取一个现有的 Element 并像这样初始化：

onModuleLoad()
{
    Element theElement = RootPanel().get("elementID");
    ElementWrapper wrapper = new ElementWrapper(theElement);
    wrapper.addMouseOverHandler(new myHandler());

}

Hope this helps.

希望这可以帮助。

回答by Bluu

If you know the element's type, you can wrap the Element and get the appropriate Widget back. In the case of, say, an Image:

如果您知道元素的类型，则可以包装 Element 并取回相应的 Widget。例如，在图像的情况下：

Element el = DOM.getElementById("someImageOnThePage");
Image i = Image.wrap(el);
i.addMouseOverHandler(...);

The only problem with this I've encountered is you'll get an AssertionError in HostedMode if the element is already attached to another parent widget. It'll work fine in production however. There's probably a good reason for that assertion, so be careful.

我遇到的唯一问题是，如果元素已经附加到另一个父小部件，您将在 HostedMode 中收到 AssertionError。但是，它在生产中可以正常工作。这种断言可能有很好的理由，所以要小心。

回答by LINEMAN78

If you know the type of the object some widgets include a static wrap function. From one of them I was able to derive the following class.

如果您知道对象的类型，一些小部件包括静态包装功能。从其中一个我能够派生出以下类。

public class Widget extends com.google.gwt.user.client.ui.Widget
{
    public Widget(Element element, boolean detatchFromDom)
    {
        super();
        if (detatchFromDom)
            element.removeFromParent();

        setElement(element);

        if (!detatchFromDom)
        {
            onAttach();
            RootPanel.detachOnWindowClose(this);
        }
    }

    public <H extends EventHandler> HandlerRegistration addDomHandlerPub(final H handler, DomEvent.Type<H> type)
    {
        return addDomHandler(handler, type);
    }
}