ExtJS vbox 布局自动高度
我有两个 extjs 项目,它们的高度可变,可以垂直放置。
我使用 Ext.container.Container 进行垂直布局,使用以下代码。
Ext.create('Ext.container.Container', {
//height:50,
renderTo: this.renderTo,
layout: {
type: 'vbox'
},
items: [item1,item2],
//autoHeight:true
});
问题是除非指定容器的高度,否则项目在页面上不可见。但是,嵌入式小部件的高度不是静态的。
有什么办法可以解决这个问题吗?我可以使用的任何其他组件都可以自动拉伸到物品的高度。
I have two extjs items which are of variable height to be layed out vertically.
I am using Ext.container.Container for the vertical layout, using the following code.
Ext.create('Ext.container.Container', {
//height:50,
renderTo: this.renderTo,
layout: {
type: 'vbox'
},
items: [item1,item2],
//autoHeight:true
});
The problem is the items are not visible on the page unless the height of the container is specified. But, the height of the embedded widgets is not static.
Is there any way to fix this issue? Any other components I can make use of which can stretch automatically to the height of the items.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
对子元素应用
flex
1,而不是高度。如果您希望比例不同,您可以使用flex
数字。例如,如果您应用flex: 2
和flex: 1
,您将在第一个元素上获得三分之二的填充,在第二个元素上获得三分之一的填充。供参考: http ://docs.sencha.com/ext-js/4-0/#!/api/Ext.layout.container.VBox-cfg-flex
Instead of height, apply a
flex
of 1 to your child elements. If you wish the ratio to be different you can play with theflex
number. For instance, if you applyflex: 2
andflex: 1
you will get 2 thirds fill on the first element, and 1 third fill on the second.For reference: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.layout.container.VBox-cfg-flex