qx.ui.core.scroll.AbstractScrollArea 出现滚动条时子项缩小

Question

我正在通过扩展 qx.ui.core.scroll.AbstractScrollArea 创建自定义小部件。这是代码粗略

qx.Class.define("headers.HeadersList", {
  extend : qx.ui.core.scroll.AbstractScrollArea,
  include: [
    qx.ui.core.MRemoteChildrenHandling
  ],

  construct: function() {
    this.base(arguments);
    this.__container = this._createItemsContainer();
    this.getChildControl("pane").add(this.__container);
    },

  members: {
    __container: null,

    _createItemsContainer: function() {
      const layout = new qx.ui.layout.VBox(10);
      const container = new qx.ui.container.Composite(layout);
      container.setPaddingRight(3);
      return container;
    },

    getChildrenContainer: function() {
      return this.__container;
    }
  }
});

内容是动态添加的。问题是当滚动条出现时，内容的宽度正在缩小以为滚动条腾出空间。

我做了一个游乐场的小例子来说明我的意思 http:// tinyurl.com/yygunxya

如果按 "Add TextField" 按钮超过 4 次，将出现滚动条并且文本框会变窄。

文本框的宽度如何在滚动条可见或不可见的情况下保持不变？

Answer 1

如果您不希望文本字段适应可用 space，您必须首先设置你想要的宽度，你必须禁止收缩：

const textField = new qx.ui.form.TextField(range.toString()).set({
   allowShrinkX: false,
   width: 300
});

qx.ui.core.scroll.AbstractScrollArea 出现滚动条时子项缩小

qx.ui.core.scroll.AbstractScrollArea children shrinking when scrollbar appears

qooxdoo