javascript - 尝试为 qx.ui.embed.Html 制作一个带有 Non-Native 、 qooxdoo-Themed 滚动条的小部件

Question

我正在尝试使用 Qooxdoo 主题滚动条来实现 qx.ui.embed.Html。 我想在 virtual list 内实现它。 我需要的只是一个带有自定义(qx 主题)滚动条的 qx.ui.embed.Html 小部件，因为它在 native 滚动中非常丑陋。

这是我的测试:

http://tinyurl.com/kcouvj2

它可以在 Playground 上使用。

但我尝试将其变成一个小部件:

(我不是这方面的专家):

qx.Class.define("phwabe.view.ChatView.PostItem",
{
  extend : qx.ui.container.Scroll,
  properties :
  {
    /** Any text string which can contain HTML, too */
    html :
    {
      check : "String",
      apply : "_applyHtml",
      event : "changeHtml",
      nullable : true
    }
  },

  members :
  {
    construct : function()
    {
        this.base(arguments)
    },
    _createChildControlImpl : function(id)
    {
      var control;
      switch(id)
      {
        //case "icon":
        //  control = new qx.ui.basic.Image(this.getIcon());
        //  control.setAnonymous(true);
        //  this._add(control, {row: 0, column: 0, rowSpan: 2});
        //  break;
        case "html":
          control = new qx.ui.embed.Html()
          control.setAllowGrowX(true);
          control.setOverflowY('hidden');
          control.setAllowShrinkY(false)
          this.add(control)
      }
    },
    _applyHtml : function(value, old)
    {
      var post = this.getChildControl("html");
      // Workaround for http://bugzilla.qooxdoo.org/show_bug.cgi?id=7679
      // Insert HTML content
      post.setHtml(value||"");
    }
  }
})

但这很难失败:

错误:创建小部件的子控件“html”时出现异常 phwabe.view.ChatView.PostItem[446-0]:不受支持的控件: Pane

我显然做错了。在 qooxdoo 中实现它的任何正确方法吗？

Answer 1

您需要返回创建的控件 - 如果没有匹配的控件(在您的情况下为“ Pane ”)，则返回基类方法:

// overridden
_createChildControlImpl : function(id)
{
  var control;

  ...

  return control || this.base(arguments, id);
}

这是一个更改后的 Playground 示例:http://tinyurl.com/loljtz6

如果高度未知，则需要添加一种机制来自动调整 qx.ui.embed.Html 小部件的内容大小，因为没有自动调整大小。