Ext GWT（GXT）工具提示在网格行上 [英] Ext GWT (GXT) tooltip over a grid row

问题描述

我正在为我的一个项目使用Ext GWT（GXT）开发自定义工具提示，并且此工具提示在选中时必须出现在网格行上。
我不能使用默认的GXT工具提示或quicktip，因为我需要能够将组件（如按钮）添加到此工具提示中。

问题是GXT Grid组件不公开与行上鼠标有关的事件（尽管有RowClick和RowMouseDown）。
我尝试用OnMouseOver和OnMouseOut事件向网格添加一个监听器，但它不能按预期工作。它会触发这些事件，只要
在任何div和跨度组成行的时候。

我看到解决这个问题的唯一方法是将子类GridView组件，并使每一行都成为一个组件本身
，但这将是很多工作，并可能会影响性能。我不禁想到有更好的方法来做到这一点。

有人对GXT有更多的经验可以给我一个启示吗？

>试试这个

  QuickTip quickTip = new QuickTip（grid）; 
 $ b grid.addListener（Events.OnMouseOver，new Listener< GridEvent< BeanModel>>（）{
 
 @Override 
 public void handleEvent（GridEvent< BeanModel> ge）{
 com.google.gwt.dom.client.Element el = grid.getView（）。getCell（ge.getRowIndex（），ge.getColIndex（））; 
 String html =< （）; getInnerText（）+< / span>; 
 el.getFirstChildElement（） .setInnerHTML（html）; 
 
} 
}）; 
  

I'm developing a custom tooltip using Ext GWT (GXT) for a project of mine, and this tooltip has to appear over Grid rows when they're selected. I can't use the default GXT tooltip or quicktip because I need be able to add Components (like buttons) to this tooltip.

The problem is that the GXT Grid component doesn't expose a event related to mousing over a row (although there's RowClick and RowMouseDown). I tried adding a listener to the Grid with the OnMouseOver and OnMouseOut events anyway, but it doesn't work as expected. It fires these events up whenever you mouse over any of the divs and spans that composes a row.

The only way I see to solve this is to subclass the GridView component and make each row become a Component itself, but that would be a lot of work and would probably impact performance as well. I can't help but think there's a better way to do this.

Could someone more experienced with GXT give me a light?

解决方案

try this

QuickTip quickTip = new QuickTip(grid);

grid.addListener(Events.OnMouseOver, new Listener<GridEvent<BeanModel>>(){

            @Override
            public void handleEvent(GridEvent<BeanModel> ge) {
                com.google.gwt.dom.client.Element el=  grid.getView().getCell(ge.getRowIndex(),ge.getColIndex());
                String html = "<span qtip='" + el.getFirstChildElement().getInnerText() + "'>" + el.getFirstChildElement().getInnerText()  + "</span>";     
                el.getFirstChildElement().setInnerHTML(html);

            }
});

这篇关于Ext GWT（GXT）工具提示在网格行上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！