Como la mayoría de los contenedores, Ext.Tabpanel deriva de Ext.Panel, con lo que hereda todas sus funcionalidades básicas. Realmente se comporta como un panel en el que el contenido se puede dividir en varios tabs, donde cada uno de ellos es un panel con su correspondiente layout

Ventanas

También Ext.Window deriva de Ext.Panel, y como cualquier contenedor puede contener otros elementos de ExtJS: sólo tienen que incluirse en el bloque ‘items’. En el ejemplo vemos cómo incluir dentro de una ventana un Ext.Tabpanel.

Además aprovechamos para ver que en el bloque items no es obligatorio definir los componentes que queremos introducir, sino que se pueden incluir los nombres de los objetos definidos aparte. De esta forma, cuando tenemos muchos componentes encadenados se mejora la legibilidad del código, aunque, hay que tener cuidado de que los objetos que añadimos estén definidos en el ámbito (scope) de nuestro objeto.

Ext.onReady(function () {
	var backendViewport = new Ext.Panel({
        layout: 'fit',
        width: 625,
        height: 448,
        border: false,
        items: [{
            xtype: 'tabpanel', // En vez de instanciar directamente el objeto, utilizamos la notación del xtype
            height: 450,
            bodyStyle: 'padding:10px',
            activeTab: 0,
            enableTabScroll:true,
            plain: true,
            items: [{
                xtype: 'panel',
                title: 'Tab #1',
                layout: 'fit',
                items: [{
                    /*
                    * Panel con layout 'column'
                    */
                    xtype: 'panel',
                    layout:'column',
                    items: [{
                        title: 'Col 1',
                        columnWidth: .333
                    },{
                        title: 'Col 2',
                        columnWidth: .333
                    },{
                        title: 'Col 3',
                        columnWidth: .333
                    }]
                }]
            },{
                xtype: 'panel',
                title: 'Tab #2',
                layout: 'form',
                width: 300,
                minWidth: 300,
                autoScroll: true,
                split: true,
                items: [{
                        xtype: 'hidden',
                        id: 'gal_id_hidden',
                        name: 'gal_id'
                    },{
                        xtype: 'textfield',
                        name: 'gal_cat_id',
                        anchor: '90%',
                        fieldLabel: 'Categoría'
                    },{
                        xtype: 'textfield',
                        name: 'gal_weight',
                        anchor: '90%',
                        fieldLabel: 'Peso Galería'
                    },{
                        xtype: 'datefield',
                        name: 'gal_date',
                        anchor: '90%',
                        fieldLabel: 'Fecha Alta'
                    },{
                        xtype: 'textfield',
                        name: 'gal_relative_path',
                        anchor: '90%',
                        fieldLabel: 'Directorio'
                    },{
                        xtype: 'textfield',
                        name: 'gal_pho_id',
                        anchor: '90%',
                        fieldLabel: 'Imágen representativa'
                    }
                ]
            },
            {
                xtype: 'panel',
                title: 'Tab #3',
                layout: 'accordion',
                layoutConfig: {
                    titleCollapse: false,
                    animate: false,
                    activeOnTop: false
                },
                items: [{
                    title: 'Subpanel 1',
                    html: 'Contenido subpanel 1'
                },{
                    title: 'Subpanel 2',
                    html: 'Contenido subpanel 2'
                },{
                    title: 'Subpanel 3',
                    html: 'Contenido subpanel 3'
                }]
            }]
        }
        ]
    });

	var windowExample = new Ext.Window({
	    closable: true,
	    resizable: true,
	    modal: false,
	    border: true,
	    plain: true,
	    closeAction: 'hide',
	    title: 'Ventana con paneles',
	    width: 640,
	    height: 480,
	    renderTo: 'divRender',
	    /*
	     * Aprovechamos para ver otro tipo de asignación de items,
	     * en vez de definirlos en el bloque 'items' lo asignamos
	     * desde una variable
	     */
	    items: [backendViewport]
	});

	windowExample.show();
});

Podéis ver el ejemplo en el siguiente enlace