Need help with layout design.

[devyn]

Hi,
I would like to do the layout as this sketch.
Following is my simplified layout and I'm wondering how can I modify to achieve "only the menu switch".
Please do suggest me if you found out any improper usage since I'm noob here

Thanks!

Ext.define("My.view.Main", {
    extend: 'Ext.tab.Panel',
    config: {        
        tabBar: {
            docked: 'bottom',
        },
        items: [
            {
                xtype : 'toolbar',
                 docked: 'top',
            },
            {
                iconCls: 'Tab1',
                scrollable: false,
                width: imgW,
                items  : [
                     {
                        xtype: 'container',
                        layout: 'vbox',
                        items: [HeaderImage,Carousel,Menu]
                    }
                ]
            },
            {
                iconCls: 'Tab2',


            },
            {
                iconCls: 'Tab3',


                
            },
            {
                iconCls: 'Tab4',    


            }
        ]
    }
});

[mrsunshine]

your sketch link does not work, no access ;-)

[devyn]

Thanks man! Link is updated. Waiting for a hero to save me

[mrsunshine]

you could add event listener to the select boxes and on value change change the menus like you want them

[devyn]

Hmm.. I get your idea. Could you help me writing the code to that specific part? I'm stuck here for 2 days already