Titanium JIRA Archive
Appcelerator Community (AC)

[AC-3185] [tableview] added 'reuse', 'willappear' events. improve scrolling on android

GitHub Issuen/a
TypeNew Feature
Priorityn/a
StatusClosed
ResolutionNeeds more info
Resolution Date2012-07-29T17:11:35.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsTitanium SDK & CLI
Labelsandroid, ios, reuse, tableview
ReporterMartin Guillon
AssigneeVarun Joshi
Created2012-07-26T06:09:49.000+0000
Updated2016-03-08T07:57:35.000+0000

Description

The firs and most important thing is an optimisation of scrolling on android. the getView() method is called many times on the same row, and every-time the setRowData was called (which is really heavy). So i changed it to only call setRowData when the data actually changed. I also added "reuse" and "rowappear" events in the tableview. This allows huge improvements in tableview loading and scrolling. For exemple if you download async images, you can start the download only when the row appears and stop it on reuse. Also you can "create" the row content only on "rowappear". When you have a lot of complex rows it can drastically improve table loading. So the idea is that you create the rowData only with empty rows. Then on "rowappear" you create your custom view and add it to the row. It works amazingly well. I still have to figure out why on android when loading the tableview, displayed cells first appear empty then fill themselves. I add to fire the "reuse" event on the row itself, because of the ios implementation. The "rowappear" event is fired on the tableview TestCase
var win = Ti.UI.createWindow({
    backgroundColor: 'white'
});

var tableview = Ti.UI.createTableView();
tableview.addEventListener('rowappear', function(_event){
    Ti.API.info('rowappear at index' + _event.index);
});
var rowData = [];
for (var i=0; i < 300; i++) {
    var row = Ti.UI.createTableViewRow({
        title: ('row ' + i)
    });
    row.addEventListener('reuse', function(_event){
        Ti.API.info('reuse row at index' + _event.index);
    });
  rowData.push(row);
}
tableview.data = rowData;
win.add(tableview);
win.open();

Comments

  1. Martin Guillon 2012-07-26

    pull request https://github.com/appcelerator/titanium_mobile/pull/2515
  2. Varun Joshi 2012-07-26

    Hi Martin, Thanks for the pull request. Just one thing, could you please create a new JIRA ticket with the same pull request against the master branch as platform is not able to merge it in the 2.1.X branch. For your reference, here is the link that explains how to contribute code to Titanium (if you dont already have it) : https://wiki.appcelerator.org/display/guides2/Contributing+to+Titanium Please close this ticket after you create the other one. Regards, Varun
  3. Martin Guillon 2012-07-28

    Yes you are right. Also i am still working on this one . I am so sure about events for that as they are async, I am thinking about using a method like HTTPClient onload. Will create a new ticket Thanks
  4. Varun Joshi 2012-07-29

    Thanks. Closing this ticket.

JSON Source