Question

我有一个从数据库中填充的网格，工作正常。现在，我想向此网格添加一个鼠标悬停事件，并显示工具提示文本，以突出显示的记录以多行方式显示所有列值。这里的业务案例是，在网格中显示了很多列，并且用户希望在选择记录之前进行快速预览而不是水平滚动到最后。在这种情况下，挤压所有这些列以适应屏幕并不是一个干净的解决方案。

我已经尝试查看GXT 3.0 API for Grid和GridView中的所有可用方法，但找不到任何内容来获取突出显示的记录。 MouseMove，MouseDown和MouseClick有几个事件，但MouseOver没有。

我尝试了各种论坛以找到一个解决方案，但似乎还没有一个，所以如果我开始这个话题，那么它也可能对其他人有用。

请注意，此问题与Ext-JS无关。我使用的版本是Ext-GWT 3.0.1。

由于

Answer 1

MouseMove是你想要的人。只有在鼠标悬停在窗口小部件上时才会触发它。

或者，您可以使用以下方法将DOM事件接收到窗口小部件：

DOM.sinkEvents(widget.getElement(), Event.ONMOUSEOVER);

在窗口小部件的constructor或onLoad方法中，然后覆盖窗口小部件的onBrowserEvent：

@Override
public void onBrowserEvent(Event event){
final int eventType = DOM.eventGetType(event);
    if(eventType == Event.ONMOUSEOVER) {
        //DISPLAY THE INFO
    }
}

这肯定比直接添加处理程序更难，但可以自定义。你可以选择其中一个。

顺便说一下，你可能想通过使用：

来获得鼠标的位置

mouseX = DOM.eventGetClientX(event);
mouseY = DOM.eventGetClientY(event);

Answer 2

您可以通过创建自定义Cell并将其传递给网格的特定ColumnConfig来实现此目的。

使用自定义Cell，您可以访问所需的所有事件。一旦您可以访问所需的信息，就可以通过多种方式显示它。 GXT为此提供了许多解决方案。 Quicktips可能是去这里的方式。

Ext-GWT 3.0网格鼠标事件

2 个答案: