Ext技巧-BorderLayout不可以动态修改布局怎么办

Ext版本:3.3.1

应用场景:在一个one-application-one-page模式的系统开发过程中,页面布局使用了borderlayout,用到了top,east和center。但是某些特别的需求需要在中央区域显示静态html内容。首先想到的就是移除center处和east处的panel,然后重新进行页面布局。无奈怎么修改都未能实现。其间之怪异问题层出不穷。

网上有许多关于此的讨论,例如:

讨论1讨论2讨论3讨论4

Ext JS官方文档中(Ext.layout.BorderLayout)有关于此的一段话:

The regions of a BorderLayout are fixed at render time and thereafter, no regions may be removed or added.The BorderLayout must have a center region, which will always fill the remaining space not used by the other regions in the layout.

大致意思是该布局的region不可以被动态(在渲染完成后)添加或删除。

参考官方Layout FAQ中关于为BorderLayout添加项目的建议论述,以及讨论4中的观点。采用了变通的方法,修改布局,将center处容器修改为accordion布局,将原center中的panel作为该容器的一个item,通过动态修改accordion的item(或其属性)来实现目的。

既然是替代方案,自然可以多种多样,此仅一例。

总结一下:

就题而论,所谓layout,本就变化无穷,稍微多一层嵌套,并无大碍。

讲大了去,不用太执着,实现不了的东西,不要将“理论上成立”作为坚持实践的依据。