Extjs changer dynamiquement la position des onglets dans tabpanel

Question

Je tabpanel:

{ 
    xtype: 'tabpanel', 
    tabPosition: 'top', // it's default value 
    items: [/*tabs*/] 
} 

Et appuyer sur un bouton qui change la mise en page:

{ 
    xtype: 'button', 
    text: 'Change layout', 
    handler: function (btn) { 
     var layout = App.helper.Registry.get('layout'); 
     if (layout === this.getCurrentLayout()) { 
      return; 
     } 
     if (layout === 'horizontal') { 
      newContainer = this.down('container[cls~=split-horizontal]');//hbox laout 
      oldContainer = this.down('container[cls~=split-vertical]');//vbox layout 
      tabPanel.tabPosition = 'top'; 
     } else { 
      newContainer = this.down('container[cls~=split-vertical]'); 
      oldContainer = this.down('container[cls~=split-horizontal]'); 
      tabPanel.tabPosition = 'bottom'; 
     } 
     oldContainer.remove(somePanel, false); 
     oldContainer.remove(tabPanel, false); 

     newContainer.insert(0, somePanel); 
     newContainer.insert(2, tabPanel); 

     newContainer.show(); 
     oldContainer.hide(); 

    } 

Quand je change la mise en page, besoin de moi aussi changer la position des onglets. Bien sûr, la modification de la propriété de configuration tabPosition n'a aucun effet.

Comment je peux changer tabPosition dynamiquement?

Answer 1

J'ai peur dans le cas de tabpanel le seul moyen est de détruire le panneau actuel et le recréer à partir de l'objet de configuration avec le réglage tabPosition modifié. Vous pouvez utiliser la méthode cloneConfig() pour obtenir l'objet de configuration du panneau existant.