简体繁体 English

边框布局TreePanel崩溃问题

[英]Border Layout TreePanel collapse issue

原文 2014-07-10 13:26:39 2 1 javascript/ extjs4.2/ collapse/ sencha-architect/ treepanel

I am working with Sencha Architect 3.1 , and i am facing an issue with Tree Panel collapse. 我正在使用Sencha Architect 3.1，并且正面临Tree Panel崩溃的问题。
There is a view port with Border layout . 有一个带有边框布局的视口。
In the west region there is one Tree Panel and Panel with same width. 在西部地区，有一个树木面板和相同宽度的面板。
I have an event listener for click of leaf node in a Tree Panel in which i will give this.collapse(), but when the Tree Panel is expanded next time it moves towards the right. 我在树面板中有一个叶子节点单击事件监听器，我将在其中给出this.collapse（），但是当树面板下次扩展时，它将向右移动。

Here is a sample fiddle which i have done which has the same problem. 这是我做过的样本小提琴，有同样的问题。

Please help me to find solution for this problem. 请帮助我找到此问题的解决方案。

1 个解决方案

The big problem here is that you are attempting to collapse the TreePanel. 这里最大的问题是您正在尝试折叠 TreePanel。

Let's take this in steps as to better understand the issue. 让我们按步骤进行操作，以更好地了解问题。 There are 2 different options for the user to see the Tree Panel in your example. 用户可以在示例中使用2种不同的选项来查看 “树面板”。

The first would be to click the expand button tool within the header on the left side. 第一种是单击左侧标题中的展开按钮工具。 But in this case the expand/collapse button tool has been hidden. 但是在这种情况下，展开/折叠按钮工具已隐藏。 Thus this way is not possible. 因此，这种方式是不可能的。

The second is to click anywhere(else) within the header along the left side. 第二个是单击标题左侧的任何地方（其他）。

The above methods for the user result in very different behaviors. 用户的上述方法导致非常不同的行为。 If the first option were used, the panel would "expand", resulting in the other panels being pushed to the right so that the Tree Panel could be shown. 如果使用第一个选项，则该面板将“展开”，从而将其他面板向右推，以便可以显示“树形面板”。 If the second option were used, the panel would "float" over the existing panels. 如果使用第二个选项，则面板将在现有面板上“浮动”。

I suggest you set hideCollapseTool: true and give the these two options a try to see for yourself. 我建议您将hideCollapseTool: true设置hideCollapseTool: true然后尝试亲自尝试这两个选项。

With with knowledge, it should be easy to understand that performing this.collapse() is the incorrect way to "hide" the Tree Panel, because the panel was never expanded. 凭着知识，应该容易理解执行this.collapse()是“隐藏” Tree Panel的错误方法，因为该面板从未扩展。 Because it was not expanded, attempting to collapse the panel results in the x location of the Tree Panel to get offset incorrectly (Sencha should have error checking here, but obviously not). 由于未展开，因此尝试折叠面板会导致树面板的x位置错误地偏移（Sencha应该在此处进行错误检查，但显然不是）。

So, the answer to question is to simply change this.collapse() to this.hide() . 因此，问题的答案是将this.collapse()更改为this.hide() 。 Unfortunately, there is no good way to tell the panel to unfloat itself and animate away. 不幸的是，没有很好的方法告诉面板使其漂浮并动画。 Either I don't know which method to call or Sencha has overlooked this issue. 我不知道该调用哪种方法，或者Sencha忽略了此问题。