在Sencha ExtJs 5
答
锚点与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%'
}
]
});
在这个例子中,你将有一个面板尺寸500×500,有两个孩子的面板,其中一人将是50×和其他一,根据本第一,将是150x250。两者都向左对齐。父面板的其余部分将是空的。 这是小提琴: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'
}]
});
在这种情况下,孩子们面板,将有大小,他的父母,500×500相同。 这里是小提琴:https://fiddle.sencha.com/#fiddle/i4s
编辑基于评论:需要注意的是“适合”可以有一个,且只有一个孩子
希望它是明确的。事情是,这两个布局旨在用于不同的情况。
很好的例子Kanor。可悲的是,我没有足够的声誉来投票你的答案。干杯! – 2015-02-12 09:43:44
请记住,“适合”布局可以有一个,并且只有一个孩子。 – mangotang 2016-01-22 17:05:24
是啊记住适合的布局应该有一个孩子 – 2016-09-19 09:02:37