Nested components

[pe_la_do]

Hi guys,
I have two problems.

The first is add a Header above a TabPanel, but the TabPanel is docked at Top. The header is custom class wich extends a common Panel.
The second is view all the content of the TabPanel, but is cut off on the iphone. In safari works well.



var header = new ui.Header({}); // a logo image and a button
var main = new Ext.TabPanel({
fullscreen: true,
type: 'dark',
sortable: false,
animation: 'slide',
items: [{
title: 'Item1',
items: [new Ext.XTemplate.from('item1', {compiled: true});]
},{
title: 'Item2',
items: [new Ext.XTemplate.from('item2', {compiled: true});]
}]
});
new Ext.Panel({
fullscreen: true,
items: [header, main],
layout: 'vbox'
});



Thanks in advance ...

[meyerovb]

When you put a full screen entity inside another fullscreen entity, the sub entity takes up the whole screen. Only have one fullscreen container on the page, and have everything else inside it.



var header = new ui.Header({dock:'top'}); // a logo image and a button
var main = new Ext.TabPanel({
fullscreen: true,
type: 'dark',
sortable: false,
animation: 'slide',
items: [{
title: 'Item1',
items: [new Ext.XTemplate.from('item1', {compiled: true});]
},{
title: 'Item2',
items: [new Ext.XTemplate.from('item2', {compiled: true});]
}],
dockedItems:[header]
});