gpt4 book ai didi

extjs - Sencha ExtJs 5 中 anchor 布局和拟合布局的区别

转载 作者:行者123 更新时间:2023-12-04 18:05:48 25 4
gpt4 key购买 nike

anchor有什么区别和 fit布局在 ExtJs 5 ?

最佳答案

Anchor 类似于 vbox 布局,但它允许您决定子项的宽度和高度。

适合布局,只是使具有此布局的组件的子组件的大小与其父组件的大小相同。

所以:

Ext.create('Ext.Panel', {
width: 500,
height: 500,
layout: 'anchor',
items: [
{
xtype: 'panel',
title: '10% height and 20% width',
anchor: '10% 20%'
},
{
xtype: 'panel',
title: '30% height and 50% width',
anchor: '30% 50%'
}
]
});

在本例中,您将有一个大小为 500x500 的面板,有两个子面板,其中一个为 50x100,另一个为 150x250。两者都向左对齐。父面板的其余部分将为空。
这是 fiddle : https://fiddle.sencha.com/#fiddle/i4r

配合:
Ext.create('Ext.Panel', {
width: 500,
height: 500,
layout: 'fit',
renderTo: Ext.getBody(),
title: 'Fit Layout',
items: [{
xtype: 'panel',
border:true,
title: 'Children of fit layout'
}]
});

在这种情况下,子面板的大小将与其父面板相同,为 500x500。
这是 fiddle : https://fiddle.sencha.com/#fiddle/i4s

根据评论编辑: 请注意,“适合”可以有一个,并且只有一个 child

希望清楚。问题是这两种布局旨在用于不同的情况。

关于extjs - Sencha ExtJs 5 中 anchor 布局和拟合布局的区别,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28471715/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com