【问题标题】:Ext-GWT 3.0 Grid Mouse EventsExt-GWT 3.0 网格鼠标事件
【发布时间】:2012-11-23 10:45:21
【问题描述】:

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

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

我也尝试了各种论坛以找到解决方案,但似乎还没有一个,所以我认为如果我开始这个帖子,它可能对其他人也有用。

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

谢谢

【问题讨论】:

    标签: gwt grid tooltip gxt


    【解决方案1】:

    MouseMove 是你想要的。仅当鼠标悬停在小部件上时才会触发。

    或者,您可以使用以下方法将 DOM 事件接收到小部件:

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

    在您的小部件的constructoronLoad 方法中,然后覆盖小部件的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);
    

    【讨论】:

    • 我有一个单独的网格类,它实现 IsWidget 并在覆盖的 asWidget() 实现中返回网格。我可以在构造函数中添加 sinkEvents,但无法覆盖 onBrowserEvent。网格类仅包含构造函数和 aswidget 方法。另一个问题是,即使我让它覆盖,是否有一个 API 调用公开,我可以使用它来获取网格中突出显示的记录,例如 getHighlightedItem 或类似的东西
    • @user1847252 所以你的意思是你没有网格类的基类?你应该......但即使你不这样做,你也只需要实现EventListener 接口。高亮记录很容易设置normalhover CSS,或者你可以添加MouseOverMouseOut处理程序。不,它不会干扰其他操作/处理程序。传播 GWT/Browser 中的所有事件。
    【解决方案2】:

    您可以通过创建自定义单元格并将其传递给网格的特定 ColumnConfig 来完成此操作。

    使用自定义单元格,您可以访问您需要的所有事件。 一旦您可以访问所需的信息,就可以通过多种方式显示它。 GXT为此提供了很多解决方案。不过,快速提示可能是这里的方法。

    【讨论】:

    • 感谢乔纳森的回复。
    • 创建自定义单元格会给我突出显示的单元格中可用的内容,而不是记录。是否可以获取记录对象本身,然后允许我检索记录中的所有列数据?如果是,那么我可以使用自定义单元格,例如用于 ID 列,然后从那里获取
    • 当然可以。当你创建你的单元类时,创建一个构造函数来接受你的视图(或者更具体地说,你的商店)。然后将此实例存储到私有最终变量中,然后您可以在存储中查询与当前模型对应的记录。有意义吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-10-26
    • 1970-01-01
    • 2010-11-13
    • 2011-08-22
    • 1970-01-01
    相关资源
    最近更新 更多