将MouseOverHandler添加到元素?

我想在GWT 1.6中监听鼠标hover事件。 由于GWT 1.6引入了处理程序和弃用的监听程序,因此我不确定如何通过存在少量信息来实现此目的。

注意:我有一个Element对象。 这就是我需要添加鼠标处理程序。 我为自己的不清晰而道歉。

谢谢!

我希望在我需要自己解决这个问题之前,我们会看到答案。 他发布的示例代码中存在一些错误,但Mark Renouf在此主题中的post具有我们所需的大部分内容。

假设你想在自定义小部件上监听鼠标hover和鼠标移出事件。 在您的小部件中,添加两个方法:

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

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

 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"); } } 

最后,将处理程序添加到窗口小部件:

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

如果您只是通过事件监听鼠标,则可以跳过鼠标处理。 如果你没有制作自定义小部件,那么小部件我已经有了添加处理程序的方法。

最后,根据线程的警告,请记住为鼠标事件添加addDomHandler ,而不是addDomHandler

您希望在类中实现这些接口:

  • HasMouseOverHandlers
  • HasMouseOutHandlers
  • MouseOverHandler
  • 向mouseOutHandler

当鼠标进入元素时会触发MouseOverEvent,而当MouseOutEvent不再结束时会触发它。

HasMouseOverHandler实现如下:

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

HasMouseOutHandler实现如下:

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

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

如果你想将一个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()); } } 

然后你可以从HTML中获取一个现有的元素并初始化如下:

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

希望这可以帮助。

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

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

我遇到的唯一问题是如果元素已经附加到另一个父窗口小部件,你将在HostedMode中得到一个AssertionError。 然而,它在生产中会很好用。 这个断言可能有充分的理由,所以要小心。

如果您知道对象的类型,则某些小部件包含静态包装函数。 从其中一个我能够得到以下课程。

 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  HandlerRegistration addDomHandlerPub(final H handler, DomEvent.Type type) { return addDomHandler(handler, type); } }