anchor 布局將使組件固定于父容器的某一個(gè)位置，使用 anchor 布局的子組件尺寸相對(duì)于容器的尺寸，即父容器容器的大小發(fā)生變化時(shí)，使用 anchor 布局的組件會(huì)根據(jù)規(guī)定的規(guī)則重新渲染位置和大小。

用anchor布局時(shí)，用anchor屬性來(lái)配置組件在父容器中的位置

anchor 屬性為一組字符串，可以使用百分比或者是 - 數(shù)字來(lái)表示。配置字符串使用空格隔開(kāi)

    Ext.application(
		{
			name:'layout_anchor',
			launch:function(){
				Ext.create(
					'Ext.panel.Panel',
					{
						width:500,
						height:300,
						title:'anchor布局',
						layout:'anchor',
						x:60,
						y:80,
						renderTo:Ext.getBody(),
						items:[
						       {
						    	   xtype:'panel',
						    	   title:'第一個(gè)',
						    	   //表示寬度為父容器的75%，高度為父容器的20%
						    	   anchor:'75% 20%'
						       },{
						    	   xtype:'panel',
						    	   title:'第二個(gè)',
						    	   //表示相對(duì)于父容器右邊距為130，相對(duì)于父容器下邊距為120
						    	   anchor:'-130 -120'
						       }
						]
					}
				)
			}
		}
)
  

Extjs4----anchor布局