I want to create one panel with multiple different lists. I've seen some stuff on the forums about creating two lists that scroll independently of one another, but that's not exactly what I'm looking for. I want them to scroll as one uber list, but with totally different types of content and styles. Here's an example of kind of what I'm going for.


Here is the code I have so far.

MixtapeMachine.levelOne = createMixtapePage({
                                        id: 'levelOne',
                                        fullscreen: true,
                                        items: [
                                                id: 'levelonelist',
                                                store: MixtapeMachine.levelOneStore,
                                                onSelect: function(list, index){
                                                                controller: MixtapeMachine.controllers.MainController,
                                                                action: 'onLevelOneSelect',
                                                                list: list,
                                                                index: index    
                                                plugins: [MixtapeMachine.noload_footer_plugin]
                                        dockedItems: [{
                                                xtype: 'toolbar',
                                                title: 'Mixtape Machine',
I've been trying to add another list to the items array, but I just can't seem to get it. Can anybody help? createMixtapeList() uses the factory method to return list item, in case your wondering.