Quelle est la syntaxe pour ajouter un panneau à un composant de fenêtre?

Question

A partir des exemples que j'ai trouvé, ce code devrait ajouter le newPanel-viewport comme région à l'est, mais il n'a tout simplement rien:

var viewport = new Ext.Viewport({ 
    layout: 'border', 
    items: [ regionMenu, regionContent ] 
}); 

var newPanel = new Ext.Panel({ 
    region: 'east', 
    width: 300, 
    html: 'this is a panel that is added' 
}); 
viewport.add(newPanel); 

Comment puis-je ajouter un nouveau panneau à une fenêtre?

Addendum

J'ai eu à travailler, voici le code principal pour ceux qui ont le même problème, je ne suis pas d'ajouter à la fenêtre, mais la région dans la fenêtre, et je vide la région son contenu avant d'ajouter un nouveau contenu:

Ext.onReady(function(){ 

    ... 

    regionContent = new Ext.Panel({ 
     id: 'contentArea', 
     region: 'center', 
     padding:'10', 
     autoScroll: true 
    }); 

    var viewport = new Ext.Viewport({ 
     layout: 'border', 
     items: [ regionMenu, regionContent ] 
    }); 

    clearExtjsComponent(regionContent); 
    var start_info_panel = new Ext.Panel({ 
     title: 'Start Info', 
     padding: 10, 
     width: 300, 
     html: 'this panel was added from the start view' 
    }); 
    regionContent.add(start_info_panel); 
    regionContent.doLayout(); 

}); 


function clearExtjsComponent(cmp) { 
    var f; 
    while(f = cmp.items.first()){ 
     cmp.remove(f, true); 
    } 
} 

Answer 1

vous devrez peut-être appeler viewport.doLayout() après avoir ajouté newpanel parce que la fenêtre est déjà rendu:

viewport.add(newPanel); 
viewport.doLayout(); 

De l'add() documentation:

Si le conteneur est déjà rendu quand add est appelé, vous devrez peut-être doLayout d'appel pour actualiser l'affichage qui provoque un enfant unrendered composants à rendre. Ceci est requis afin que vous puissiez ajouter plusieurs composants enfant si nécessaire, alors que seulement rafraîchir la mise en page une fois.

Answer 2

Pour clarifier, le problème réel est que vous ne pouvez pas charger génériquement un nouveau composant directement dans tout conteneur qui a déjà un BorderLayout. De par sa nature, un BorderLayout occupe tout l'espace de son conteneur (la fenêtre dans votre cas) et gère tous les panneaux qu'il contient. En tant que tel, vous ne pouvez pas entrer plus tard et coller un autre panneau dans le même conteneur - il n'a nulle part où aller. Comme vous l'avez déduit, l'approche appropriée consiste à créer votre BorderLayout puis à ajouter de nouveaux composants enfants dans des régions spécifiques de cette mise en page.