将列表组件添加到视图后的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触摸空白屏幕

回答

相关问题