在Sencha ExtJs 5

Question

之间的锚布局和适合布局之间的差异ExtJs 5的anchor和fit布局有什么区别？

Answer 1

锚点与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

编辑基于评论：需要注意的是“适合”可以有一个，且只有一个孩子

希望它是明确的。事情是，这两个布局旨在用于不同的情况。