ExtJs 4パネルの幅を動的に増やす方法は？

Question

パネルに新しいボタンを追加すると、そのパネルのサイズを動的に増やしたいのですか？私は、パネルの幅が新しいボタンごとに増加しなければならないパネルに新しいボタンを追加すると

Ext.onReady(function() { 

    Ext.tip.QuickTipManager.init(); 

    Ext.define('myPanel', { 
     extend:'Ext.panel.Panel', 
     bodyStyle : {"background-color":"#DFE8F6","padding":"2px"}, 
      width:100, 
     border:false, 
     viewConfig: 
     { 
      forceFit: true, 
     } 
     }); 

    new myPanel({ 
     id:'_panel', 
      renderTo:Ext.getBody() 
    }); 
     new Ext.button.Button({ 
     text:'Click Me', 
     renderTo:Ext.getBody(), 
     handler:function() 
     { 
      Ext.getCmp('_panel').add(new Ext.button.Button({text:'hello'})); 
      Ext.getCmp('_panel').doLayout(); 
     } 
    }); 
}); 

ここで幅が100 です。 ここではボタンのテキストごとにボタンのサイズが異なります。

Answer 1

ExtJSの」コンポーネントは、その幅のための機能を持っているので、私はあなたが試すことができると思いますので：

handler:function() 
    { 
     var btn = new Ext.button.Button({text:'hello'}); 
     var panel = Ext.getCmp('_panel'); 
     panel.setWidth(panel.getWidth() + btn.getWidth()); 
     panel.add(btn); 
     panel.doLayout(); 
    } 

Answer 2

あなたはmaxWidthやminWidthプロパティを設定しましたか？たとえば、maxWidthを100に設定してsetWidth(120)を試してみると、動的に機能しません。

これは私に起こったことです。私のSencha ArchitectのUIデザイナーはパネルの最大幅を設定しましたが、最大値を超えてsetWidth()にしようとしていました。

このような愚かなことのために1時間を無駄にしました！ :(