Panel Unable to be Scrolled

I'm definitely struggling here trying to figure out what's wrong.

I have a panel with a scrollable config that gets set as the active item in the viewport. Normally it has a few items (a top docked bar, a bottom docked bar, and an XTemplate) but for the sake of getting to the bottom of this I've removed them.

Code:

var homeView = Ext.create( 'Ext.Panel', { 
    fullscreen: true, 
    id: 'Home', 
    scrollable: { 
        direction: 'vertical', 
        directionLock: true 
    }, 
    html: 'scroll test'
});

Pretty simple.

It gets added to the viewport pretty standardly.

Code:

Ext.Viewport.setActiveItem(homeView);

However, I'm unable to scroll the page when the app runs on my device (I'm building with cordova). I can call and it'll behave but I cannot physically move my finger across the screen to get it to scroll.

Furthermore, and this may be related, my top docked Toolbar and my bottom docked TabBar both will not respond to touch input at all, but my item that's simply html generated by an XTemplate does respond properly to tapping (I just can't scroll it.)

Is there anything that could cause this? Maybe something happening in the initial setup?


Thanks in advance, any help is appreciated.



Panel Unable to be Scrolled