0

在 hbox 布局中，如果我们隐藏一个组件，那么所有其他组件都会重新对齐。

考虑到我有以下布局，

hbox1:

   combo1  combo2 combo3 combo4

如果我隐藏组合 1，那么布局会重新对齐，

hbox2:

  combo2 combo3 combo4

这里combo2重新定位到combo1的地方。

但我喜欢保留组件在 hbox1 中的位置。

有任何想法吗？

4

3 回答 3

2

1*您可能应该制作2个嵌套控件并隐藏内部控件，同时保持外部控件的宽度不变..这种方法增加了开销，但会做
2*您可以做的另一件事是远离extjs操作 dom .. extjs 在彼此内部创建多个 div，因此您可以手动访问其中一个内部 div 并将其隐藏
3* 不要在 extjs 中使用 hide() 函数，
而是创建一个特殊的隐藏函数来更改 div 组件的样式隐藏并将 div 的所有可能颜色设置为透明或背景颜色。它仍然会被隐藏，只是所有附加的事件都会起作用..
4 * 或者，您可以屏蔽组件而不是隐藏它。这样用户会知道这个特定项目被禁用，并且用户也不会被允许与相应的组件交互

于 2012-08-30T07:25:00.503 回答
1

(1) 我们最近实施的一个解决方案是允许隐藏组件参与 HBOX 布局的布局/调整大小：

不要使用 隐藏组件，而是Ext.Component#hide使用 禁用它们Ext.Component#disable。此外，cls在每个组件上配置一个属性，例如ghost.

然后定义一个CSS规则

ghost.x-item-disabled {
    visibility: hidden;
}

背景：

  • 因为组件不被视为“隐藏”到 Ext 布局引擎，所以将考虑调整大小/布局。
  • display:block浏览器不会渲染任何可见的表示，而是让元素占据盒子模型中的空间——这是和之间的主要区别visibility:hidden。
  • 因为组件是disabled，所以它不会响应任何用户交互。

(2) 尝试将hideMode这些组件设置为visibility。请参阅http://docs.sencha.com/ext-js/4-1/#!/api/Ext.AbstractComponent-cfg-hideMode。

如果您使用最初可见的所有项目呈现工具栏，然后隐藏单个项目，这可能会起作用。但是，我实际上希望它根本不工作或在非常有限的情况下工作。最好选择（1）。

于 2012-08-30T15:06:10.423 回答
0

感谢您的回答。我通过使dom被隐藏来实现，

component.el.dom.hidden=true;  //Hides the text field of combo
component.el.dom.nextSibiling.hidden = true; // hides the drop down imageof combo
于 2012-08-30T17:39:29.957 回答