GWT CellTable tooltip not working properly

雨燕双飞 提交于 2019-12-06 00:32:25

You can extend Column class and override method render. In render method you can use property "title", which is used to set the tool tip text. Simple example:

SampleColumn<T> extends TextColumn<T> {

  @Override
  public void render(Context context, T object, SafeHtmlBuilder sb) {
    sb.appendHtmlConstant("<div title=\"" + getTitle(object) + "\">");
    sb.appendEscaped(getValue(object));
    sb.appendHtmlConstant("</div>");
  }

  @Override
  public String getValue(T object) {
    return displayedValue;
  }

  public String getTitle(T object) {
    return yourTooltipText;
  }
}

When using this code, the tooltip will be exacly near the target cell.

if (cellElement.getParentElement()
              .getFirstChildElement().isOrHasChild(Element.as(event.getNativeEvent().getEventTarget()))
              && cellElement.getTagName().equalsIgnoreCase("span"))

This resolves the issue.
Thanks Andrei & Alex for replies.

Thank you all, I was looking for a solution to that as well.

Using A cup of tea's answer, I made a generic class that can be reused to add tooltips to any cell. It's based on a decorator pattern. Here it is if it may help someone:

public class TooltipCell extends AbstractSafeHtmlCell<String>
{
    AbstractCell<String> cell;
    private String tooltip;

    public TooltipCell(AbstractCell<String> cell, String tooltip)
    {
        super(SimpleSafeHtmlRenderer.getInstance(), BrowserEvents.CLICK, BrowserEvents.KEYDOWN);
        this.cell = cell;
        this.tooltip = tooltip;
    }

    @Override
    protected void render(com.google.gwt.cell.client.Cell.Context context, SafeHtml data, SafeHtmlBuilder sb)
    {
        sb.appendHtmlConstant("<div title=\"" + tooltip + "\">");
        cell.render(context, data.asString(), sb);
        sb.appendHtmlConstant("</div>");
    }

    @Override
    public void onBrowserEvent(com.google.gwt.cell.client.Cell.Context context, Element parent, String value, NativeEvent event, ValueUpdater<String> valueUpdater)
    {
        cell.onBrowserEvent(context, parent, value, event, valueUpdater);
    }
}

Then it can be used as follows:

myColumn = new Column<MyObject, String>(new TooltipCell(new ButtonCell(), "tooltip text"))
    {
        @Override
        public String getValue(CurrencyDTO object)
        {
            return "button text";
        }
    };

This solution works:

cellTable.addCellPreviewHandler(new Handler<List<String>>() {
  @Override
  public void onCellPreview(CellPreviewEvent<List<String>> event) {
    if ("mouseover".equals(event.getNativeEvent().getType())) {
      cellTable.getRowElement(event.getIndex()).getCells().getItem(event.getColumn()).setTitle('cell contents go here.');
    }
  }
}
cellTable.addCellPreviewHandler(new Handler<List<String>>() {
  @Override
  public void onCellPreview(CellPreviewEvent<List<String>> event) {
    if ("mouseover".equals(event.getNativeEvent().getType())) {
      cellTable.getRowElement(event.getIndex()).getCells().getItem(event.getColumn()).setTitle('cell contents go here.');
    }
  }
}

Andrei's solution works good but there is a bug should be fixed:

cellTable.getRowElement(event.getIndex() - cellTable.getPageStart()).getCells().getItem(event.getColumn()).setTitle('cell contents go here.');
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!