BB Custom Rows

customrows.js

// Thanks to Jon Alter for the idea

var win = Ti.UI.currentWindow;

var data = [];
for (var i = 0; i < 10; i++) {
	data.push({title:'I am row text '+i, leftImage:'../images/user.png', header: 'Yes'});
}

for (var i = 0; i < 10; i++) {
	data.push({title:'I am row text '+i, leftImage:'../images/user.png'});
}

var tableView = Ti.UI.createTableView({
	data:data
});
tableView.setCreateCallback(function(e) {
	Ti.API.info('In Call Back');
	var view;
	if(e.rowData.header == 'Yes'){
		
		view = Ti.UI.createView({
			width:'fill',
			height:20
		});
		
		if (e.index % 2 == 0) {
			view.backgroundColor = '#999';
		}
		else {
			view.backgroundColor = '#fff';
		}

		var label = Ti.UI.createLabel({
			text:"I am a header",
			color:'#336699',
			top:5,
			left:60,
			height:20,
			font:{fontSize:20, fontWeight:'bold'},
		});
		view.add(label);
	}
	
	else{
		
		view = Ti.UI.createView({
			width:'fill',
			height:70
		});
		
		if (e.index % 2 == 0) {
			view.backgroundColor = '#999';
		}
		else {
			view.backgroundColor = '#fff';
		}
		
		var imageView = Ti.UI.createImageView({
			image:e.rowData.leftImage,
			left:5,
			width:50,
			height:50,
			canScale:true,
			borderColor:'black',
			borderWidth:5,
		});
		view.add(imageView);
	
		var label = Ti.UI.createLabel({
			text:e.rowData.title,
			color:'#336699',
			top:5,
			left:60,
			height:20,
			font:{fontSize:20, fontWeight:'bold'},
		});
		view.add(label);
		
		var button = Ti.UI.createButton({
			title:'Button-'+e.index,
			height:30,
			left:60,
			top:30,
			font:{fontSize:12},
		});
		button.addEventListener('click', function() {
			alert('You clicked Button-' + e.index);
		});
		view.add(button);
	}
	Ti.API.info('Done with Call Back');
	return view;
});
tableView.addEventListener('click', function(e) {
	Ti.API.info('You clicked Row-' + e.index);
});

var scrollView = Ti.UI.createScrollView();
scrollView.add(tableView);
win.add(scrollView);