【问题标题】:ExtJS 6 TreePanel scrolling not workingExtJS 6 TreePanel滚动不起作用
【发布时间】:2016-01-06 09:34:47
【问题描述】:

我一直在尝试让我的树形面板以两种方式滚动。 这是我的代码:https://fiddle.sencha.com/#fiddle/13cb

我可以在包装面板中设置scrollable: true,但这并不能解决水平滚动问题。 此外,通过这种方法,组合框也会向上滚动。但我只希望树形面板水平和垂直滚动。我怎样才能做到这一点?

提前致谢

【问题讨论】:

  • 在树面板上使用style: {overflow: 'auto'} 你在做什么?
  • 你的建议让它双向滚动,是的,但它不完全是我所追求的。使用您的解决方案,我面板中的工具栏也会滚动('我已经更新了我的小提琴)

标签: javascript extjs scrollable treepanel


【解决方案1】:

我不确定我们是否能完全实现您想要的。不过让我们试试吧。

要使垂直滚动条正常工作,您必须在树形面板上定义一个高度。到目前为止,树形面板会根据其内容的高度动态调整大小,因为没有为其定义高度。由于即使父面板也没有定义高度,所以将高度作为百分比也行不通,但是例如身高:500 会。如果您需要在调整浏览器窗口大小时布局浮动,请查看父面板的 vboxborder 布局。

要使水平滚动条正常工作,您必须了解网格列的工作原理。您尚未定义列配置,这使得树形面板假定您希望单个列占据树形面板宽度的 100%:

   if (!me.columns) {
        if (me.initialConfig.hideHeaders === undefined) {
            me.hideHeaders = true;
        }
        me.addCls(me.autoWidthCls);
        me.columns = [{ // define columns configuration with a single column
            xtype    : 'treecolumn', // the column should be a treecolumn
            text     : 'Name',
            flex     : 1, // and take up 100% of the width of the panel
            dataIndex: me.displayField // and use the displayField as 
        }];
    }

您不能使列自动占据其内容所需的宽度。但是你可以例如收听nodeexpand and nodecollapse 事件并调用column.autoSize()

【讨论】:

  • 您好,谢谢您的回答!我已经用你的建议更新了我的小提琴。我必须改进一下,但这就是我想要的。再次感谢!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-05-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多