Elemente werden in Sencha Touch 2 nicht geladen

Question

Ich habe eine Sencha Touch-Anwendung, die ein Tabpanel verwendet, eine Beta-Version dieser Anwendung lädt alle Elemente des Tabpanels und zeigt es. Bei so vielen Elementen wurde der Wechsel zwischen den Tabs langsamer Zur Optimierung ist meine Idee, Elemente nur zu laden, wenn ein bestimmtes Panel aktiviert wird, nachdem eine Lademaske angezeigt wurde.

Ich habe es geschafft, dass es beim ersten Klick funktioniert, aber wenn ich ein anderes Mal zur gleichen Registerkarte wechsle, wird es nicht ausgefüllt oder zumindest werden die Elemente nicht angezeigt. Es werden keine Ausnahmen ausgelöst.

Ext.application({
    name : 'Sencha',
    launch : function() {
           var root = contents;
           var children = root._listOfContentChild;
           var mainPanel =  Ext.create('components.NavigationPanel',
                {
                iconCls : 'more', 
                listeners: {

                   activate: function() {   
                             mainPanel .setMasked({ 
                                xtype: 'loadmask',
                                message: 'Loading...'
                            });

                           setTimeout(function() {          
                              loadItems(root,children);  // returns my items
                              mainPanel .setItems(items);
                              mainPanel .setMasked(false);
                            }, 300);

    } } });

   var settingsPanel =  Ext.create('components.NavigationPanel', {
        title : 'Settings',
        iconCls : 'settings',
    });

  view=Ext.Viewport.add({
        xtype : 'tabpanel',  
        deferredRender:true,

        tabBarPosition : 'bottom',
        activeItem:settingsPanel,
        items : [mainPanel,settingsPanel ]
    }); 
    }
    });

Überblick: meine Anwendung funktioniert korrekt, wenn alle Elemente zu Beginn ausgefüllt werden, bevor auf die Registerkarten gedrückt wird Mein Problem ist, wenn ich eine große Anzahl von Elementen habe und ich drücke auf die entsprechende Registerkarte. es hängt für 1,2 Sekunden. Eine Person, die diese Anwendung benutzt, wird denken, dass sie nicht richtig auf die Registerkarte gedrückt hat und es wird so langsam aussehen. mein ansatz ist es, eine maske zu laden, wenn ich die tabs nur für 1 sek. drücke, damit die tabs automatisch reagieren, wenn ich sie drücke. dann füge ich meine artikel hinzu. diese idee funktioniert nur für den ersten klick, wenn ich zu einer anderen tab und wieder zurück zur ursprünglichen tab wechsle, wird nichts angezeigt (außer der lademaske) ich habe versucht mainPanel.add anstelle von mainPanel.setItems . ich habe ein anderes Problem, jetzt in der nächsten Tippen auf das Panel, meine Artikel werden angezeigt, aber ohne die Lade-Maske, als ob ich die Elemente am Anfang vor dem Drücken laden.