Hello again,

Still new at Sencha Touch and having issues with adding a navigation "toolbar" to my app (which is basically a horizontally-scrolling carousel of 17 sections, with several sections containing simple panels and others containing vertically scrolling carousels).

If I don't add "floating:true" to my navigation bar, it displays behind the carousel. If I add "floating:true", it displays correctly, but I can't get any "buttons" within it to display at all—doesn't even render (if I inspect it with a browser).

I don't know whether or not to include the buttons via the items[] array of my navBar Panel (I've tried switch it to Toolbar, Container, etc. Nothing works), and I get this error:

"Uncaught TypeError: Property '1' of object function (j,f){e.call(h,j,g,c,b,a,h,arguments.callee,f)} is not a function"

Here's my code for the navigation bar and the "toolbar home" button I'm trying to add to it (basically a clear div over the background image to add a listener to):

Code:
var tb_home = new Ext.Panel({
    id:'tb_home',
    cls:'tb_btn',
    width:40,
    height:32,
    layout: {type: 'vbox', align: 'start', pack: 'end'},
    floating:true,
    hidden: true,
    showAnimation:{ type: 'slide', direction:'down'},
    style:'position:relative; cursor:pointer; z-index:21000; width:40px; height:32px;',
    listeners: { tap: {element: 'el', fn: function(){
        if (navBar.isVisible()){
            navBar.hide();
            tb_home.hide();
            } else {
            navBar.show();
            tb_home.show();
        }
             mainPages.setActiveItem(s01);
         }}}
});


var navBar = new Ext.Panel({
    id:'navbar',
    showAnimation:{ type: 'slide', direction:'down'},
    layout: {type: 'vbox', align: 'start', pack: 'start'},
    fullscreen: false,
    hidden: true,
    floating: true,
    width: 1024,
    height:32,
    items: [/*tb_home*/],
    style:'background:url(app/images/00_top_bar.png) no-repeat 0 0; position:relative; z-index:20000;    width:1024px; height:32px;'
});
And here's an example of one of the panels I'm trying to use to fire the show/hide on the navigation bar:

Code:
var s01_pg01_bg = new Ext.Panel({
    id:'s01_pg01_bg',
    style: "background:#000 url(app/images/sec01_pg01_cover.jpg) no-repeat 0 0;",
    width:1024,
    height:748,
    listeners: { tap: {element: 'el', fn: function(){
        if (navBar.isVisible()){
            navBar.hide();
            tb_home.hide(); // this appears to be where the error is being generated from
        } else {
            navBar.show();
            tb_home.show();
        }
    }}}
});
Are their any tutorials that walk through all these types of things? I feel like the "Hello World" tutorials and screencasts are overly simple and don't adequately set up a real-life application, but then things like the kitchen sink only show one example of a feature and don't elaborate on options or multiple examples—and the screencasts and tutorials seem to skip up to a way-over-my-head-you-need-to-be-a-good-developer-to-understand-this-stuff level.