सेन्चा टच 2 सूची कंटेनर

Question

में अदृश्य है मैं कंटेनर पर सूची के साथ सरल दृश्य लिखने की कोशिश कर रहा हूं लेकिन मुझे कुछ समस्याएं हैं। सब से सबसे पहले, सूची दिखाई नहीं जब मैं इस तरह यह करने के लिए कोशिश कर रहा हूँ है:

Ext.define('App.view.News', { 
    extend: 'Ext.Container', 

लेकिन जब यह इस तरह लिखा है:

Ext.define('App.view.News', { 
    extend: 'Ext.navigation.View', 

यह काम करता है।

समस्या यह है कि जब मैं इसे नेविगेशन के विस्तार के साथ लिखता हूं। देखें, मुझे शीर्ष पर दो टूलबार मिल रहे हैं और मुझे दूसरे को अक्षम करने के लिए समाधान नहीं मिल रहा है (सूची द्वारा जोड़ा गया)।

पूर्ण कोड:

Ext.define('App.view.News', { 
    extend: 'Ext.Container', //Ext.navigation.View 
    xtype: 'news', 
    requires: [ 
     'Ext.dataview.List', 
     'Ext.data.proxy.JsonP', 
     'Ext.data.Store' 
    ], 
    config: { 
     style: ' background-color:white;', 

     items: 
     [ 
      { 
       xtype: 'toolbar', 
       docked: 'top', 
       title: 'News', 
       minHeight: '60px', 
       items: [ 
        { 
         ui: 'back', 
         xtype: 'button', 
         id: 'backButton', 
         text: 'Back', 
        }, 

        { 
         minHeight: '60px', 
         right: '5px', 
         html: ['<img src="resources/images/Image.png"/ style="height: 100%; ">',].join(""), 
        }, 
       ],   
      }, 

      { 
       xtype: 'list', 
       itemTpl: '{title},{author}', 
       store: { 
        autoLoad: true, 
        fields : ['title', 'author'], 
        proxy: { 
         type: 'jsonp', 
         url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog', 
         reader: { 
          type: 'json', 
          rootProperty: 'responseData.feed.entries' 
         } 
        } 
       } 
      } 
     ] 
    } 
}); 

मदद कृपया!

Answer 1

आपको अपने कंटेनर को एक लेआउट और अपनी सूची को एक फ्लेक्स संपत्ति देने की आवश्यकता है। फ्लेक्स सूचियों पर महत्वपूर्ण है क्योंकि स्क्रॉल होने के बाद उनके पास देखने योग्य ऊंचाई नहीं है। मैंने नीचे आपके कोड में कुछ गुण जोड़े। उम्मीद है की यह मदद करेगा।

Ext.define('App.view.News', { 
    extend: 'Ext.Container', //Ext.navigation.View 
    xtype: 'news', 
    requires: [ 
     'Ext.dataview.List', 
     'Ext.data.proxy.JsonP', 
     'Ext.data.Store' 
    ], 
    config: { 
     style: ' background-color:white;', 
     layout: 'vbox', // add a layout 
     items: 
     [ 
      { 
       xtype: 'toolbar', 
       docked: 'top', 
       title: 'News', 
       minHeight: '60px', 
       items: [ 
        { 
         ui: 'back', 
         xtype: 'button', 
         id: 'backButton', 
         text: 'Back', 
        }, 

        { 
         minHeight: '60px', 
         right: '5px', 
         html: ['<img src="resources/images/Image.png"/ style="height: 100%; ">',].join(""), 
        }, 
       ],   
      }, 

      { 
       xtype: 'list', 
       itemTpl: '{title},{author}', 
       flex: 1, // add a flex property 
       store: { 
        autoLoad: true, 
        fields : ['title', 'author'], 
        proxy: { 
         type: 'jsonp', 
         url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog', 
         reader: { 
          type: 'json', 
          rootProperty: 'responseData.feed.entries' 
         } 
        } 
       } 
      } 
     ] 
    } 
});