extjs4 सामग्री की अधिकतम चौड़ाई तक स्वचालित रूप से ग्रिड कॉलम चौड़ाई कैसे सेट करें?

Question

यदि आप कोई कॉलम चौड़ाई या फ्लेक्स विशेषता वाले ग्रिड बनाते हैं, तो कॉलम प्रत्येक को 100px पर डिफ़ॉल्ट कर देगा।

यदि आप हेडर सेपरेटर पर डबल क्लिक करते हैं, तो बाएं ऑटो का कॉलम उस कॉलम में सबसे बड़ी डेटा आइटम के आकार तक फैलता है।

क्या कुछ कॉलम स्वचालित रूप से उस व्यवहार को कॉन्फ़िगर करने के लिए कॉन्फ़िगर करने का कोई तरीका है?

Answer 1

forceFit: true आपकी ग्रिड व्यू कॉन्फ़िगरेशन पर कॉलम को सभी शेष स्थान भरने के लिए मजबूर कर देगा।

forceFit: स्तंभ चौड़ाई हर समय फिर से सानुपातिक है करने के लिए सही निर्दिष्ट करें बूलियन।

प्रत्येक कॉलम की प्रारंभिक रूप से कॉन्फ़िगर की गई चौड़ाई को ग्रिड चौड़ाई फिट करने और क्षैतिज स्क्रॉलिंग को रोकने के लिए समायोजित किया जाएगा। यदि कॉलम बाद में आकार बदलते हैं (मैन्युअल रूप से या प्रोग्रामेटिक रूप से), ग्रिड में अन्य कॉलम ग्रिड चौड़ाई फिट करने के लिए आकार बदल दिए जाएंगे।

कॉलम जो निश्चित के साथ कॉन्फ़िगर किए गए हैं: सत्य आकार से छोड़े गए हैं।

Answer 2

कुछ स्तंभ बहुत व्यापक हो सकते हैं, उदाहरण के लिए: विवरण टेक्स्ट या लंबा नाम। यदि आप फील्ड चौड़ाई ऑटो सेट करते हैं, तो कुछ कॉलम आपके दृश्य पर महत्वपूर्ण स्थान ले सकते हैं। इस परिदृश्य में अधिकतम चौड़ाई सीमा क्या होनी चाहिए। 50 चार्ज, 100 चार्ज?

Answer 3

तो मुझे लगता है कि forceFit नहीं रह गया है Sencha द्वारा की सिफारिश की है, तो आप चाहिए AutoSize विधि का उपयोग कर प्रयास करें:
संपादित करें: वहाँ आप एक संक्षिप्त उदाहरण के साथ जाना है, यह पहले कॉलम :)

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     { text: 'Name', dataIndex: 'name', width: 150, autoSizeColumn: true }, 
     { text: 'Email', dataIndex: 'email', width: 150, autoSizeColumn: true, minWidth: 150 }, 
     { text: 'Phone', dataIndex: 'phone', width: 150 } 
    ], 
    viewConfig: { 
     listeners: { 
      refresh: function(dataview) { 
       dataview.panel.columns[0].autoSize();//works on the first colum 
      } 
     } 
    }, 
    width: 450, 
    renderTo: Ext.getBody() 
}); 

पर काम करता है मुझे एक ही समस्या थी, उम्मीद है कि यह मदद करता है!