Question

我想实现一个可标记的HTML表格单元格。对于HTML，我使用了HTML Cellrenderer，它运行良好。为了获得Cell标记，我发现我必须设置＆＃34; -webkit-user-select＆＃34;形成无文字。为此，我编写了自己的HTML cellrender。我扩展了＆＃34; qx.ui.table.cellrenderer.Conditional＆＃34;，添加了HTML Cellrenderer的实现并添加了这个函数，我在构造函数中调用：

_createStyleSheet : function() {
        var colorMgr = qx.theme.manager.Color.getInstance();
        var stylesheet = ".qooxdoo-table-cell {" + qx.bom.element.Style.compile({
            position : "absolute",
            top : "0px",
            overflow : "hidden",
            whiteSpace : "nowrap",
            borderRight : "1px solid " + colorMgr.resolve("table-column-line"),
            padding : "0px 6px",
            cursor : "default",
            textOverflow : "ellipsis",
            userSelect : "text"
        }) + "} " + ".qooxdoo-table-cell-right { text-align:right } " + ".qooxdoo-table-cell-italic { font-style:italic} " + ".qooxdoo-table-cell-bold { font-weight:bold } ";

        if (qx.core.Environment.get("css.boxsizing")) {
            stylesheet += ".qooxdoo-table-cell {" + qx.bom.element.BoxSizing.compile("content-box") + "}";
        }

        qx.ui.table.cellrenderer.Abstract.__clazz.stylesheet = qx.bom.Stylesheet.createElement(stylesheet);
    }

现在单元格是可标记的，但HTML标签不会被转换。另外我得到以下错误：padawan.js：210 Uncaught TypeError：无法设置属性＆＃39; stylesheet＆＃39;未定义的

Answer 1

您可能没有从Abstract Cellrenderer的构造函数中复制所有需要的代码。它将解释为什么qx.ui.table.cellrenderer.Abstract.__clazz未定义。所以你还应该添加this part：

var cr = qx.ui.table.cellrenderer.Abstract;
if (!cr.__clazz)
{
  cr.__clazz = this.self(arguments);
  this._createStyleSheet();

  // add dynamic theme listener
  if (qx.core.Environment.get("qx.dyntheme")) {
    qx.theme.manager.Meta.getInstance().addListener(
      "changeTheme", this._onChangeTheme, this
    );
  }
}

和_onChangeTheme方法。

这是一个带有扩展HTML CellRenderer的完整playground example。

更好的实践可能是编写自己的渲染，实现ICellRenderer接口。

可标记的HTML表格单元格

1 个答案: