सेन्चा एक्स्टजेस में एंकर लेआउट और फिट लेआउट के बीच अंतर 5

Question

anchor और fit लेआउट ExtJs 5 में अंतर क्या है?

Answer 1

एंकर vbox लेआउट के समान है, लेकिन यह आपको बच्चों की वस्तुओं की चौड़ाई और ऊंचाई तय करने की अनुमति देता है।

फ़िट लेआउट, बस यह बनाता है कि इस लेआउट के साथ घटक के बच्चे के माता-पिता के समान आकार होगा।

तो:

Ext.create('Ext.Panel', { 
width: 500, 
height: 500, 
layout: 'anchor', 
items: [ 
    { 
     xtype: 'panel', 
     title: '10% height and 20% width', 
     anchor: '10% 20%' 
    }, 
    { 
     xtype: 'panel', 
     title: '30% height and 50% width', 
     anchor: '30% 50%' 
    } 
] 
}); 

इस उदाहरण में आप एक पैनल आकार 500x500 के साथ दो बच्चों पैनलों, उनमें से एक 50x100 हो जाएगा और एक दूसरे के साथ, होगा यह पहली तहत, 150x250 हो जाएगा। दोनों बाईं ओर गठबंधन। शेष मूल पैनल, खाली हो जाएगा। यहाँ यह बेला है: https://fiddle.sencha.com/#fiddle/i4r

फिट के साथ

:

Ext.create('Ext.Panel', { 
width: 500, 
height: 500, 
layout: 'fit', 
renderTo: Ext.getBody(), 
title: 'Fit Layout', 
items: [{ 
    xtype: 'panel', 
    border:true, 
    title: 'Children of fit layout' 
}] 
}); 

इस मामले में, बच्चों पैनल, अपने माता-पिता, 500x500 के रूप में एक ही आकार होगा। https://fiddle.sencha.com/#fiddle/i4s

संपादित टिप्पणी के आधार पर: ध्यान दें कि "फिट" एक है, और केवल एक ही बच्चा

आशा है कि यह स्पष्ट है हो सकता है यहाँ बेला है। बात यह है कि उन दो लेआउट का उद्देश्य विभिन्न मामलों में इस्तेमाल किया जाना है।