2016-06-21 5 views
0

に私は私が交互に幅の列レイアウト内のコンポーネントの数を持っている状況、すなわち0.75その後、0.25を持っています。宣言のデフォルト値は、コンフィグ

Ext.define('MyApp.view.TestView', { 
    extend: 'Ext.panel.Panel', 
    layout: 'column', 

    items: [{ 
     xtype: 'textfield', 
     columnWidth: .75 
    }, { 
     xtype: 'textfield', 
     columnWidth: .25, 
    }, { 
     xtype: 'textfield', 
     columnWidth: .75 
    }, { 
     xtype: 'textfield', 
     columnWidth: .25, 
    }, { 
     xtype: 'textfield', 
     columnWidth: .75 
    }, { 
     xtype: 'textfield', 
     columnWidth: .25, 
    } 

    ] 
}); 

Ext.onReady(function() { 
    Ext.create('MyApp.view.TestView', { 
     renderTo: Ext.getBody(), 
     width: 400 
    }); 
}); 

設定オブジェクトにこれらの2つの値を保存する方法はありますか?私は誰かが幅の変更を望むたびにすべてを変更する必要はありません。デフォルト値を設定することはできません。なぜなら、変更したい値が1つだけではないからです。

私はコンストラクタで設定オブジェクトにこれらの値を適用するには何とか可能かもしれないと考えていた、または私はこのようになります可能な解決策があるかもしれません考えていた。

Ext.define('MyApp.view.TestView', { 
    extend: 'Ext.panel.Panel', 
    layout: 'column', 

    config: { 
     colWidth1: .75, 
     colWidth2: .25 
    } 


    items: [{ 
     xtype: 'textfield', 
     columnWidth: 'colWidth1' 
    }, { 
     xtype: 'textfield', 
     columnWidth: 'colWidth2' 
    }, { 
     xtype: 'textfield', 
     columnWidth: 'colWidth1' 
    }, { 
     xtype: 'textfield', 
     columnWidth: 'colWidth2' 
    }, { 
     xtype: 'textfield', 
     columnWidth: 'colWidth1' 
    }, { 
     xtype: 'textfield', 
     columnWidth: 'colWidth2' 
    } 

    ] 
}); 

Ext.onReady(function() { 
    Ext.create('MyApp.view.TestView', { 
     renderTo: Ext.getBody(), 
     width: 400 
    }); 
}); 

https://fiddle.sencha.com/#fiddle/1ccj

答えて

4

最も単純なオプションは、宣言的な設定を使用して設定オプションに物事をリンクすることはできないと考えているので、initComponentメソッドの項目を定義することです。

残念ながら、私はあなたがbind設定をcolumnWidth設定がセッターを持たないために使用できないと思います。

例えば、このバイオリンをチェックアウト - https://fiddle.sencha.com/fiddle/1ccq/

Ext.define('MyApp.view.TestView', { 
    extend: 'Ext.panel.Panel', 
    layout: 'column', 


    initComponent: function(){ 
     var colWidth1 = .75, 
      colWidth2 = .25; 

     Ext.apply(this, { 
      items: [{ 
       xtype: 'textfield', 
       columnWidth: colWidth1 
      }, { 
       xtype: 'textfield', 
       columnWidth: colWidth2 
      }, { 
       xtype: 'textfield', 
       columnWidth: colWidth1 
      }, { 
       xtype: 'textfield', 
       columnWidth: colWidth2 
      }, { 
       xtype: 'textfield', 
       columnWidth: colWidth1 
      }, { 
       xtype: 'textfield', 
       columnWidth: colWidth2 
      } 
      ] 
     }); 

     this.callParent(arguments); 
    } 
});