我们最近将 ext-js 从 4.1 更新到 4.2。在 4.1 上,以下代码可以调整此处使用的 vbox 子项的大小。我们可以在这些孩子之间拖动边框,并且两个项目都会调整大小。
在 4.2 中,无法调整这些子项的大小。当指向正确的空间时,甚至光标都不会改变形状。
Ext.define('Example.view.NavPanel', {
extend: 'Ext.panel.Panel',
alias: 'widget.exampleNavPanel',
requires: ['Example.view.example.List', 'Example.view.example2.List', 'Example.view.paneledycji.EditTabPanel'],
layout: {
type: 'vbox',
align: 'stretch',
pack: 'start'
},
items: [
{
xtype: 'panel',
title: 'Navpanel',
collapsible: true,
flex: 1,
layout: {
type: 'hbox',
pack: 'start',
align: 'stretch'
},
items: [
{xtype: 'exampleList', flex: 1},
{xtype: 'example2List', flex: 3}
]
},
{
xtype: 'editTabPanel',
flex: 1
}
]
});
我尝试添加
resizable:true
给第一个孩子。它使光标在指向边框时改变形状,我可以拖动它......但孩子们不会调整大小。当我从第一个孩子中删除 flex 时,我终于可以调整项目的大小,但它几乎没有问题:
- 我可以调整第一个项目的高度和宽度,我只想要高度,这就是它在 4.1 中的工作方式
- vbox 将为第一个孩子提供尽可能多的空间,如果第一个孩子太大,第二个孩子甚至不在窗口中,因为边框在屏幕外,所以无法看到或调整第一个孩子的大小
- 对任何一个孩子设置 minHeight 完全没有效果
我希望能够为上孩子设置最小和最大高度,最好是百分比,并禁用宽度调整。理想情况下,我还希望能够为两个孩子设置默认尺寸。我无法使用 docs.sencha.com 上列出的任何配置组合来解决这个问题。我需要做什么才能达到这个效果?