I see that you've posted this question twice, so I just picked this one. Please remove the other thread, it's not necessary. I couldn't review your Google document because I didn't have permission to it so I made an assumption on what you needed help with. Here is an example of a layout with an image on top of a tab panel:
Code:
Ext.define('MyApp.view.Main', {
extend : 'Ext.Container',
xtype : 'main',
requires : [
'Ext.tab.Panel',
'Ext.Img'
],
config : {
items : [
{
xtype : 'image',
src : 'http://placehold.it/320x75',
width : 320,
height : 75
},
{
xtype : 'tabpanel',
items : [
{
title : 'Welcome',
iconCls : 'home',
html : 'home content'
},
{
title : 'Get Started',
iconCls : 'action',
html : 'getting started content'
}
]
}
]
}
});
Your question is centered on the concept of layouts so a study of the layout guide will probably help you further:
http://docs.sencha.com/touch/2-1/#!/guide/layouts
I hope this helps you,
Brice