gwt - 如何使用 GWT 将 Canvas 用作 celltable 小部件的单元格？

Question

问题在于，如何使用 GWT 中的 CellTable 创建一个带有 Canvas 的自定义单元格？

我搜索了一种将 Canvas 转换为 html 并将其附加到渲染方法的 SafeHtmlBuilder 参数的方法，但没有成功。这是自定义单元格的有趣片段:

public void render(Context context, String value, SafeHtmlBuilder sb) {

    Canvas c = Canvas.createIfSupported();

    // create a text into the canvas using the value parameter
    // something like (this is not important) : 
    c.getContext2d().drawTheText(value);

    // here is the problem, what kind of transformation may I do 
    // to use the canvas in this cell ?
    SafeHtml safeValue = SafeHtmlUtils.fromString(c.?????);
    sb.append(safeValue);
}

编辑:这是可行的解决方案，感谢托马斯

sb.append(SafeHtmlUtils.fromTrustedString("<img src=\"" + canvas.toDataUrl() + "\" />"));

注意，应该使用模板，而不是直接使用一段html代码。

Answer 1

我想你必须使用toDataURL()并建立一个 <img>元素来显示它。

请注意，您可以重复使用相同的 Canvas render 调用之间的实例;只需确保在重复使用之前清除它即可。