在使用 ExtJs 边框布局时,我希望我的 East 面板只能通过单击面板的标题来展开和折叠,即使用浮动特性。我的查询是:
- 如何删除折叠按钮?
- 如何删除浮动动画?(animCollapse 属性似乎只适用于折叠按钮上执行的折叠和展开操作)
Ext.require(['*']);
Ext.onReady(function() {
new Ext.container.Viewport({
layout: 'border',
items: [{
region: 'west',
collapsed: true,
hideCollapseTool: true,
floatable: true,
width: 200,
title: 'Foo'
}, {
region: 'center'
}]
});
});
在 ExtJS 4.1.2 之前,无法禁用浮动面板的动画。现在,如果 animCollapse 设置为 0,动画将被禁用。
重要的!!! animCollapse 属性可以设置为 true、false 或动画持续时间(以毫秒为单位)。但是,如果设置为 false,它仍将使用默认动画时间。它必须设置为 0。我认为这是一个错误,尚未在 4.2.2 中修复
如果您想禁用动画但无法将项目更新到 ExtJS 4.1.2 或更高版本,请将持续时间添加到 floatCollapsedPanel 中的 slideIn 调用和 Ext.panel.Panel 源代码中的 slideOutFloatedPanel 中的 slideOut 调用中。
...
me.el.slideIn(slideDirection, {
preserveScroll: true,
duration: Ext.Number.from(me.animCollapse, Ext.fx.Anim.prototype.duration),
listeners: {
afteranimate: function() {
me.isSliding = false;
}
}
});
...
和
...
compEl.slideOut(collapseDirection, {
preserveScroll: true,
duration: Ext.Number.from(me.animCollapse, Ext.fx.Anim.prototype.duration),
listeners: {
afteranimate: function() {
me.slideOutFloatedPanelEnd();
// this would be in slideOutFloatedPanelEnd except that the only other
// caller removes this cls later
me.el.removeCls(Ext.baseCSSPrefix + 'border-region-slide-in');
me.isSliding = false;
}
}
});
...
参见 Ext.panel.Panel 的 4.1.2 源代码:http: //docs.sencha.com/extjs/4.1.2/source/Panel5.html#Ext-panel-Panel