ExtJS कैसे vbox पैनल के लिए 100% ऊंचाई निर्धारित करने के लिए

Question

हाय ~,

मैं पैनल 2. करने के लिए 100% से अधिक छोड़ दिया ऊंचाई सेट करना चाहते हैं, लेकिन मैं कैसे करना है पता नहीं है ..

सच और ऊंचाई: '100%' पैनल 2 के लिए, लेकिन यह काम नहीं करता

यहाँ अपने परीक्षण कोड,

{ 
    title : 'EAST', 
    region : 'east', 
    layout : 'vbox', 
    layoutConfig : { 
     align : 'stretch' 
    }, 
    bodyStyle : 'border:1px solid blue', 
    width: 300, 
    items : [ 
     new Ext.Panel({ 
      title : 'Panel 1', 
      border : true, 
      layout : 'fit', 
      height : 250, 
      html : 'PANEL 1 AREA' 
     }), 
     new Ext.Panel({ 
      title : 'Panel 2', 
      border : true, 
      bodyStyle : 'border:1px solid red', 
      layout : 'fit', 
      html : 'PANEL 2 AREA' 
     }) 
    ] 
} 

मैंने कोशिश की, autoHeight है।

कोई भी जानता है, कृपया मेरी मदद करें ~

धन्यवाद ~!

Answer 1

आपको दूसरे पैनल के लिए flex संपत्ति का उपयोग करना चाहिए।

new Ext.Panel({ 
    title : 'Panel 2', 
    border : true, 
    bodyStyle : 'border:1px solid red', 
    layout : 'fit', 
    html : 'PANEL 2 AREA', 
    flex: 1 
}) 

Answer 2

दूसरे पैनल में फ्लेक्स संपत्ति की स्थापना जब घटक एक कंटेनर जो एक BoxLayout उपयोग करने के लिए कॉन्फ़िगर किया गया है द्वारा प्रदान की गई है

new Ext.Panel({ 
     title  : 'Panel 2', 
     border : true, 
     bodyStyle : 'border:1px solid red', 
     layout : 'fit', 
     html  : 'PANEL 2 AREA', 
     flex  : 1 

    }) 

फ्लेक्स केवल प्रयोग किया जाता है की कोशिश करो। प्रत्येक फ्लेक्स प्रॉपर्टी के साथ प्रत्येक बच्चे घटक को फ्लेक्स वैल्यू के साथ सभी घटकों के योग की तुलना में आइटम के रिश्तेदार फ्लेक्स वैल्यू के अनुसार या तो लंबवत (VBoxLayout द्वारा) या क्षैतिज रूप से (HBoxLayout द्वारा) फ्लेक्स किया जाएगा।