Question

使用these lines of code我可以在tableviewrows中显示大约数百tableview个module.exports.draw = function(){ els = []; var cocktails = Ti.App.cocktails; for(var i=0;i<cocktails.length;i++){ els.push({ type: 'Ti.UI.View', searchableText : cocktails[i].nome, properties : { cocktail_id:cocktails[i].id, borderColor:"#eee", borderWidth: 1, height: 100, nome:cocktails[i].nome }, childTemplates : [ { type: 'Ti.UI.Label', bindId : cocktails[i].id, properties : { text: cocktails[i].nome, cocktail_id:cocktails[i].id, color:"#000", left:30, zIndex:10, top:10, font:{ fontSize:20, fontWeight:'bold' } }, events : { click : function(e) { Ti.App.fireEvent("render",{pag:'prepare',id:e.bindId}); } } }, { type : 'Ti.UI.Label', properties : { left:30, color:"#999", top:50, cocktail_id:cocktails[i].id, text:cocktails[i].ingTxt != undefined?cocktails[i].ingTxt:'' }, bindId:cocktails[i].id, events : { click : function (e){ Ti.App.fireEvent("render",{pag:'prepare',id:e.bindId}); } } } ] }); } var search = Ti.UI.createSearchBar({ height:50, width:'100%' }); search.addEventListener('cancel', function(){ search.blur(); }); var content = Ti.UI.createListView({sections:[Ti.UI.createListSection({items: els})],searchView:search}); search.addEventListener('change', function(e){ content.searchText = e.value; }); return content; };。问题是窗口在3秒内打开（android设备）。我想我需要进行一些优化才能在不到1秒的时间内显示表格。

有关它的任何建议吗？提前谢谢

修改代码行

{{1}}

Answer 1

你需要研究延迟加载 http://www.appcelerator.com/blog/2013/06/quick-tip-cross-platform-tableview-lazy-loading/

Answer 2

如thiswayup所示，延迟加载可能是一个非常好的主意。

如果你不想使用延迟加载，你可以这样做：

function getListWindow( items ) {
   var firstLayout = true;

   var win = Ti.UI.createWindow({
      //Your properties here.
   });

   var list = Ti.UI.createTableView({
      data : [],
      //other properties here
   });
   win.add(list);

   win.addEventListener('postlayout', function() {
      if(firstLayout) {
         firstLayout = false;

         var rows = [];

         //Assuming the items argument is an array.
         items.forEach(function( item ) {
            rows.push( Ti.UI.createTableViewRow({
               //Properties here based on item
            }));
         });

         list.data = rows;
      }
   });

   return win;
}

执行此操作会立即打开窗口，并在显示窗口后加载行。在生成行时显示加载器可能是个好主意。

钛显示数百行tableviewrow

2 个答案: