Tab panel icon not working with navigation view sencha touch

Question

 Ext.define('Sample.view.MainMenu', {
    extend: 'Ext.tab.Panel',
    config: {
            tabBar: {
                    docked: 'bottom'
            },
            items: [{
                    xtype: 'mypanel',
            }, {
                    xtype: 'mycartlist'
            }, {
                    xtype: 'cartitemscheck',
            } ]
    }
 });

Above is my first view that has tab panel docked bottom that displays mypanel view by default and mypanel view is the navigation view .. here I am having a problem .. if I navigate from my panel view to other views in the card layout and click on the tab icon mycartlist, and when I click back on the mypanel icon .. it is showing the page view that is navigated last.. but I want the mypanel first view to be displayed whenever the mypanel icon is clicked. please tell me how this works.

Answer 1

If i understood correctly.. Using navigation view reset method and This will solve your problem

    Ext.define('Sample.view.MainMenu', {
       extend: 'Ext.tab.Panel',
        xtype : 'mainmenu',
        config: {
                tabBar: {
                        docked: 'bottom'
                },
                items: [
                    {
                        xtype: 'mainview',
                        listeners : {
                            activate : function( nav, newActiveItem, oldActiveItem, eOpts ) {
                               // Reseting navigation view
                                nav.reset();
                            }
                        }
                    }, 
                    {
                        xtype: 'mycartlist'
                    }, 
                    {
                        xtype: 'cartitemscheck',
                    }]
                }
    });