Controlling Width & Animation of Rows inside GROUPED tableView (iPhone).

You must Login before you can answer or comment on any questions.

Hi, attempting to semi-recreate adding new contacts to app as experienced in the Address Book of iPhone. I've deduced (perhaps incorrectly) this must be done within a tableView in order to have similar functionality (i.e. animation of added rows grouped together).

RE: WIDTH

Have spent all day trying to control the width of tableView rows that have been GROUPED. Have concluded (again, possibly incorrectly), the only way to do this is to create a GROUPED tableView within another GROUPED tableView (insane?). See code (tableView exists within tbvMain). If you remove tbvMain, all attempts to modify the width of GROUPED tableView rows fail. First question... is this really the solution?

RE: ANIMATION

Second, regarding the animation of dynamically appended or added rows. If you run the below example, you'll see the first added row does not animate (it merely appears). The second added row (and so-on) animates as desired.

An example of how this should function can be seen when you begin adding a phone number on the iPhone (Add New Contact). The animation is smooth from the first append / addition.

Does anyone know how this is accomplished? Thank you in advance!

var win = Ti.UI.currentWindow;
var tbvMain = Ti.UI.createTableView({style:Titanium.UI.iPhone.TableViewStyle.GROUPED});
 
function addRow(e){
    var row       = Ti.UI.createTableViewRow({height: 40});
    row.className = 'contact';
    tableView.insertRowAfter(e.index, row, {animationStyle: Titanium.UI.iPhone.RowAnimationStyle.DOWN});
}
 
var data = [];
var row         = Ti.UI.createTableViewRow({height: 40});
var firstRow    = Ti.UI.createLabel({text: 'New Row Test', color:'#999', textAlign:'center'});
row.add(firstRow);
row.className = 'contact';
row.addEventListener('click', function(e){addRow(e)});
data[0] = row;
 
var tableView    = Ti.UI.createTableView({
    width: 260, right: 10,
    data: data, 
    editable: true, editing: false, 
    allowsSelectionDuringEditing: true,
    style:Titanium.UI.iPhone.TableViewStyle.GROUPED
});
 
tbvMain.add(tableView);
win.add(tbvMain);

— asked 9 months ago by Rick Cox
0 Comments

Your Answer

Think you can help? Login to answer this question!