將列表組件添加到視圖後的Sencha觸摸空白屏幕

我正在嘗試將List組件添加到Sencha Touch中的視圖。該應用程序正常運行，直到我嘗試添加列表組件。將列表添加到視圖後，應用程序加載（顯示啓動畫面），然後僅顯示白色屏幕。將列表組件添加到視圖後的Sencha觸摸空白屏幕

我正在使用Sencha Touch，XCode 4，iOS 5 SDK和PhoneGap 1.3.0。

在此先感謝！

這裏的視圖的代碼：

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, { 
dockedItems: [{ 
      dock: 'top', 
      html: '<img src="images/logo.jpg"/>' 
     }, 
     { 
     xtype: 'list', 
     itemTpl : '{name}', 
     grouped : true, 
     indexBar: true, 
     store: newStore 

    }] 
});

和我的測試數據庫的代碼。我有這個index.html中的頭：

var newStore; 

    function onBodyLoad(){ 
     Ext.regModel('Plants', { 
      fields: ['name', 'efficiency'] 
     }); 

     newStore = new Ext.data.JsonStore({ 
      model : 'Plants', 
      sorters: 'name', 

      getGroupString : function(record) { 
       return record.get('name')[0]; 
      }, 

      data: [ 
       {name: 'Milwaukee', efficiency: .85}, 
       {name: 'New York', efficiency: .65}, 
       {name: 'St Paul',  efficiency: .73}, 
       {name: 'Phoenix',  efficiency: .35}, 
       {name: 'Los Angeles', efficiency: .45}, 
       {name: 'Miami',  efficiency: .75}, 
       {name: 'London',  efficiency: .39}, 
       {name: 'Moscow',  efficiency: .95}, 
       {name: 'Hogwarts', efficiency: .99} 
      ] 
     }); 
    }

來源

2012-02-10 kevinstueber

您的身體負荷創建您的商店，即後裝列表，以便在列表中所需的newStore對象爲空。將這個代碼：

Ext.regModel('Plants', { 
     fields: ['name', 'efficiency'] 
    }); 

    newStore = new Ext.data.JsonStore({ 
     model : 'Plants', 
     sorters: 'name', 

     getGroupString : function(record) { 
      return record.get('name')[0]; 
     }, 

     data: [ 
      {name: 'Milwaukee', efficiency: .85}, 
      {name: 'New York', efficiency: .65}, 
      {name: 'St Paul',  efficiency: .73}, 
      {name: 'Phoenix',  efficiency: .35}, 
      {name: 'Los Angeles', efficiency: .45}, 
      {name: 'Miami',  efficiency: .75}, 
      {name: 'London',  efficiency: .39}, 
      {name: 'Moscow',  efficiency: .95}, 
      {name: 'Hogwarts', efficiency: .99} 
     ] 
    });

權利之前：

plantanalyzer.views.BuildingList = Ext.extend(Ext.Panel, { 
dockedItems: [{ 
      dock: 'top', 
      html: '<img src="images/logo.jpg"/>' 
     }, 
     { 
     xtype: 'list', 
     itemTpl : '{name}', 
     grouped : true, 
     indexBar: true, 
     store: newStore 

    }] 
});

要檢查，如果這真的是這樣。

另一個建議是，您應該將列表放在面板的項目中，而不是dockedItems。順便說一句，你的代碼結構不好。你應該遵循MVC模式。檢查這個https://vimeo.com/17705448和這個http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/。

來源

2012-02-10 15:14:17 ilija139

就是這樣，我感謝您花時間幫忙！你正在成爲我的私人導師。 – kevinstueber 2012-02-10 15:26:12

我很高興能幫上忙。你可以在這裏找到很棒的教程和指南：http://www.sencha.com/learn/touch/和這裏：https：//vimeo.com/sencha/videos。你也可能想開始學習Sencha Touch 2而不是1.1。 – ilija139 2012-02-10 15:34:08

不會'refresh（）'也解決這個問題嗎？ – Tjorriemorrie 2013-06-26 10:50:17

將列表組件添加到視圖後的Sencha觸摸空白屏幕

回答

相關問題