GXTのグリッドセルにツールチップを置く方法は？

Question

ツールチップを特定のグリッドセルGXTにマウスオーバーで配置するにはどうすればよいですか？

グリッド全体のツールチップを配置できますが、特定のグリッドセルを配置する方法が見つかりませんでした。

具体的には、グリッドセルから情報を取得する方法と、カーソルがセルの上にあるときに、セルからの情報をツールチップに表示する方法はありますか。

Answer 1

私は最も簡単な方法はQuickTipクラスを使用することだと思います。これは、いくつかのコンテナでマウスオーバーを聞き、qtip属性が存在する各子DOM要素のヒントを示します。例：

public class GxtToolTipInGxtGrid implements EntryPoint { 

    public static class Model { 
     private final String name; 

     public Model(String name) { 
      this.name = name; 
     } 

     public String getName() { 
      return name; 
     } 
    } 

    interface ModelProperties extends PropertyAccess<Model> { 
     ValueProvider<Model, String> name(); 
    } 

    private static List<Model> MODELS = Arrays.asList(new Model("John"), new Model("Mary")); 
    private static ModelProperties PROPERTIES = GWT.create(ModelProperties.class); 

    public void onModuleLoad() { 
     ListStore<Model> store = new ListStore<>(Model::getName); 
     store.addAll(MODELS); 

     List<ColumnConfig<Model, ?>> columns = new ArrayList<>(); 
     ColumnConfig<Model, Model> column = new ColumnConfig<>(new IdentityValueProvider<>(), 200, "Name with tooltip"); 
     column.setCell(new SimpleSafeHtmlCell<>(new AbstractSafeHtmlRenderer<Model>() { 
      @Override 
      public SafeHtml render(Model object) { 
       SafeHtmlBuilder sb = new SafeHtmlBuilder(); 
       //QuickTip will use this attribute (qtip) for showing the tip. 
       sb.appendHtmlConstant("<div qtip='" + object.getName() + "'>"); 
       sb.appendEscaped(object.getName()); 
       sb.appendHtmlConstant("</div>"); 
       return sb.toSafeHtml(); 
      } 
     })); 
     columns.add(column); 
     columns.add(new ColumnConfig<>(PROPERTIES.name(), 100, "Name w/o tooltip")); 

     Grid<Model> grid = new Grid<>(store, new ColumnModel<>(columns)); 
     RootPanel.get().add(grid); 
     //Attach QuickTip to grid 
     Scheduler.get().scheduleDeferred(() -> new QuickTip(grid)); 
    } 
} 

しかしこれは静的なアプローチです。つまり、ツールチップを表示するか、ツールチップに表示するかは、レンダリングフェーズで行われました。しかし、動的なアプローチが必要な場合は、QuickTipアナログのカスタム実装が行われる可能性があります。

また、Ext GWT (GXT) tooltip over a grid rowをご覧ください。別のソリューションが含まれている可能性があります。

Answer 2

1. グリッドにクイックヒップを登録します。

新しいQuickTip（myGrid）

オーバーライドツールチップを持っているために、そのセルのレンダリング機能

。

public void render(Context context, ImageResource value, SafeHtmlBuilder sb){ 
        sb.appendHtmlConstant("<div qtip='TOOLTIPVALUE'>");   
        super.render(context, value, sb); 
        sb.appendHtmlConstant("</div>"); }