如何解决网格行上的Ext GWTGXT工具提示
| 我正在为我的项目使用Ext GWT（GXT）开发自定义工具提示，并且当选择了这些网格时，该工具提示必须出现在Grid行上。 我无法使用默认的GXT工具提示或quicktip，因为我需要能够在此工具提示中添加Components（例如按钮）。 问题在于，GXT Grid组件不会公开与鼠标悬停有关的事件（尽管有RowClick和RowMouseDown）。 我尝试通过OnMouseOver和OnMouseOut事件将侦听器添加到Grid，但是它没有按预期工作。每当它触发这些事件 您将鼠标悬停在组成行的任何div和span上。 我看到解决此问题的唯一方法是对GridView组件进行子类化，并使每一行成为一个组件本身， 但这将需要大量工作，并且也可能会影响性能。我忍不住想，有更好的方法可以做到这一点。 谁能对GXT更有经验吗？解决方法
尝试这个
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);
}
});
{
width: 200,dataIndex : \'invoice\',renderer:addTooltip
}
function addTooltip(value,metadata){
metadata.attr = \'ext:qtip=\"\' + value + \'\"\';
return value;
}
var myGrid = grid;
myGrid.on(\'render\',function() {
myGrid.tip = new Ext.ToolTip({
view: myGrid.getView(),target: myGrid.getView().mainBody,delegate: \'.x-grid3-row\',trackMouse: true,renderTo: document.body,listeners: {
beforeshow: function updateTipBody(tip) {
tip.body.dom.innerHTML = \"Over row \" + tip.view.findRowIndex(tip.triggerElement);
}
}
});
});
grid.addListener(Events.OnMouseOver,new Listener<GridEvent<Model>>() {
@Override
public void handleEvent(GridEvent<Model> ge) {
if (grid.getToolTip() != null) {
grid.getToolTip().hide();
}
ModelData model = ge.getModel();
if (model != null) {
Object someValue = model.get(\"someProperty\");
String label = someValue.toString();
grid.setToolTip(label);
}
if (grid.getToolTip() != null) {
grid.getToolTip().show();
}
}
});
GridView<RowSet> view = new GridView<RowSet>() {
private Element cell;
@Override
protected void handleComponentEvent(Event event) {
switch (event.getTypeInt()) {
case Event.ONMOUSEMOVE:
cell = Element.is(event.getEventTarget()) ? findCell((Element) event.getEventTarget().cast())
: null;
break;
}
super.handleComponentEvent(event);
}
@Override
protected void onRowOut(Element row) {
grid.hideToolTip();
grid.setToolTipConfig(null);
super.onRowOut(row);
}
@Override
protected void onRowOver(final Element row) {
super.onRowOver(row);
grid.hideToolTip();
grid.setToolTipConfig(null);
ToolTipConfig config = new ToolTipConfig();
int rowIndex = grid.getView().findRowIndex(row);
// Through \"rowIndex\" you can get the Row like this :
// grid.getStore().get(rowIndex)
config.setBodyHtml(\"Your tool tip text here\");
config.setTitleHtml(\"Tool Tip Title\");
config.setCloseable(true);
grid.setToolTipConfig(config);
int absoluteRight = (cell != null) ? cell.getAbsoluteRight() : row.getAbsoluteRight();
int absoluteTop = (cell != null) ? cell.getAbsoluteTop() : row.getAbsoluteTop();
Point point = new Point(absoluteRight,absoluteTop);
grid.getToolTip().showAt(point);
}
};
view.setAutoFill(true);
grid.setView(view);
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。