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