Изменяемые TreePanel в окне в ExtJS

Question

У меня есть TreePanel:

treepanel = Ext.define('filteredTree', { 
         extend: 'Ext.tree.Panel', 
         title: 'Filtered Tree', 
         store: store, 
         width: 784, 
         height: 550, 
         buttons: [ 
         { 
          text: 'Select', 
          handler: function() { 
           var panel = this.up('treepanel'); 
           //...selection of value 
          } 
         } 
        ] 
    //...Here is search mechanism 

    }); 

и окно, в котором он отображается. Окно изменяемое:

 win = Ext.create('widget.window', { 
      title: 'Выбор значения из словаря', 
      header: { 
       titlePosition: 2, 
       titleAlign: 'center' 
      }, 
      closable: true, 
      closeAction: 'hide', 
      maximizable: true, 
      width: 800, 
      minWidth: 350, 
      height: 600, 
      tools: [{ type: 'pin' }], 
      theme:"classic", 
      layout: { 
       type: 'border', 
       padding: 5 
      }, 
      items: [ 
       Ext.create('filteredTree') 
      ] 
     }); 

Я хотел бы видеть, если размер окна изменяет размер панели также изменяется. Как я могу это сделать?

Answer 1

Изменить расположение окна на .

Панель будет занимать полное пространство внутри окна и соответственно изменять размеры. Вы можете удалить высоту и ширину с панели деревьев.

Ext.create('Ext.window.Window', { 
      title: 'Выбор значения из словаря', 
      header: { 
       titlePosition: 2, 
       titleAlign: 'center' 
      }, 
      closable: true, 
      closeAction: 'hide', 
      maximizable: true, 
      width: 600, 
      minWidth: 350, 
      height: 400, 

      layout:'fit', 
      items: [ 
       {xtype:'treepanel', 
       padding:5, 
         title: 'Filtered Tree',     
         buttons: [ 
         { 
          text: 'Select', 
          handler: function() { 
           var panel = this.up('treepanel'); 

          } 
         } 
        ]} 
      ] 
     }).show();