九宫格布局练习

Ext.create('Ext.Container', {
    fullscreen: true,
    layout: 'vbox',
	defaults: {
                flex: 1,
                width: '100%',
                padding: 10,
                defaults: {
                    flex: 1,
                    height: '100%',
                    margin: 10
                }    
            },
    items: [
        {
                xtype: 'panel',
                layout: 'hbox',
                items:[
                    {xtype:'button',text:'按钮1'},
                    {xtype:'button',text:'按钮2'},
					{xtype:'button',text:'按钮3'},
                    
                ],
				  flex: 1
        },
        {
            xtype: 'panel',
                layout: 'hbox',
                items:[
                    {xtype:'button',text:'按钮1'},
                    {xtype:'button',text:'按钮2'},
					{xtype:'button',text:'按钮3'},
                   
                ],
				  flex: 1
        },
		 {
           xtype: 'panel',
                layout: 'hbox',
                items:[
                    {xtype:'button',text:'按钮1'},
                    {xtype:'button',text:'按钮2'},
					{xtype:'button',text:'按钮3'},
                   
                ],
				  flex: 1
        },
		 {
            xtype: 'panel',
                layout: 'hbox',
                items:[
                    {xtype:'button',text:'按钮1'},
                    {xtype:'button',text:'按钮2'},
					{xtype:'button',text:'按钮3'},
                   
                ],
				  flex: 1
        }
    ]
});

评论

1 楼 a121267963 2013-07-31  

还行，，很简单。