ExtJS : 창에서 양식 필드의 크기를 자동으로 조정합니다.

Question

내부에 일부 Ext.form 필드가있는 Ext.Window를 만들었습니다. 그러나 창 크기를 조정할 때 양식 요소에는 여전히 초기 폭과 높이가 있습니다.

윈도우 크기 조정시 양식 필드의 크기를 명시 적으로 조정해야합니까? 또는 양식 필드의 크기를 자동으로 조정할 수있는 옵션이 있습니까?

샘플 코드 :

var f_1 = new Ext.form.TextField({fieldLabel: 'Label 1'}); 
var f_2 = new Ext.form.TextField({fieldLabel: 'Label 2'}); 
var fp = new Ext.form.FormPanel({items: [f_1, f_2]}); 

var w = new Ext.Window({ 
    layout: 'form', 
    title: 'test', 
    items: fp 
}); 

w.show() 

Answer 1

당신은 능숙하게 크기 조정이 가능한 형태의 만드는, 고정을 확인할 수 있습니다 :

http://www.extjs.com/deploy/dev/examples/form/anchoring.html

는 "구성 요소"에서 "앵커"속성을 참조하십시오

을

http://www.extjs.com/deploy/dev/docs/?class=Ext.Component

Answer 2

var f_1 = new Ext.form.TextField({fieldLabel: 'Label 1', anchor:'95%'}); 

그것을 할 것입니다. 약간의 샘플 there과 문서 there을 볼 수 있습니다. 또한

당신이 defaults 구성 객체와 폼 패널에서 기본을 밀어 수 있습니다 그들 각각의 크기를 지정하지 않으려면 나의 의심은

var fp = new Ext.form.FormPanel({ 
      items: [f_1, f_2] 
      ,defaults: { 
       anchor: '95%' 
      } 
     }); 

Answer 3

은은 FormPanel "FP는"일부입니다 잘못으로.

Ext JS에서는 일반적으로 Ext.Window 생성자 내에서 모든 창을 아래쪽으로 모두 선언하는 것이 가장 좋습니다. 물건을 만들고 나중에 첨부하려고하면 나를 위해 많은 좌절의 원천이되었습니다.

(좋아, 너비에 대한 다른 답변 : 100 % 가능성이 높습니다. 그러나 한 번에 모든 것을 선언하지 않을 때 크기 조정 등 많은 문제가있었습니다. 정확히 알아 내지 못했습니다. . 그렇게 아직 할 확인 때)