Problem
Changing the "hasCheck" property of a row in a table causes the views to visibly "jump". By "jump" I mean the rows suddenly move down 10 pixels for a split second, then move back to where they were before.
Expected Behavior
While the row does resize a bit horizontally to account for the check mark, it shouldn't influence the vertical sizing or positioning of elements. Therefore, this "jump" isn't something expected.
Sample Code
The following creates a simple table with two rows. Run it in the iOS simulator, and touch the rows to toggle "hasCheck". The top row will jump, the bottom row behaves normally. NOTE: the only difference between the jumpy and normal rows are the "top" and "bottom" properties (... and the text)!
// window
var win = Ti.UI.createWindow({ backgroundColor: '#fff' });
win.open();
// table
win.add(table = Ti.UI.createTableView({
rowHeight: 80
}));
table.addEventListener('click', function (e) {
e.row.hasCheck = !e.row.hasCheck;
});
// jumpy row
var row = Ti.UI.createTableViewRow();
row.add(Ti.UI.createLabel({
text: 'Touch To Check + Jump Me (Bottom Aligned Label)',
bottom: 0, left: 0,
height: 'auto', width: 250
}));
table.appendRow(row);
// solid row
var row2 = Ti.UI.createTableViewRow();
row2.add(Ti.UI.createLabel({
text: 'Touch To Check Me (Top Aligned Label)',
top: 0, left: 0,
height: 'auto', width: 250
}));
table.appendRow(row2);
Associated Helpdesk Ticket
http://support-admin.appcelerator.com/display/LZW-54742-861
Marking resolved as the pull req was merged.
Tested with 1.8.0.v20110819142548 iPhone 4.3.4 iPad2 4.3.2 Motorola Xoom 3.2 Nexus One 2.2.2