I am currently in the process of developing an iOS app using Titanium. Within my app, I have a tableview that consists of two images and various labels on each row. My goal is to allow users to click on either of the images to swap them with other images, as well as click on a label (such as a phone number) to prompt the dialer. At the moment, clicking anywhere within the row triggers the image swap functionality. Below is a snippet of the code I am working with:
//First, I set up my table and make a call to a PHP file to retrieve JSON data. I then proceed to create rows and define an image element
row = Ti.UI.createTableViewRow({
backgroundImage: 'images/openmatchesrowbackground.png',
selectionStyle: Titanium.UI.iPhone.TableViewCellSelectionStyle.NONE,
width: '100%',
height: '180pt',
rowId: i
});
var acceptmatchView = Ti.UI.createView({
left: '0pt',
top: '0pt',
width: '60pt',
height: '60pt'
});
var acceptmatch = Ti.UI.createImageView({
image: 'images/nomatch.png',
left: '0pt',
top: '0pt',
width: '60pt',
action: 'swapImages',
height: '60pt'
});
//Following this, I add some labels and append everything to the row - Next, I establish an event listener
tableview.addEventListener('click', function(e) {
var imageView = e.row.children[0].children[0];
if (imageView.image == 'images/nomatch.png') {
imageView.image = 'images/match.png';
var matchSelected = json.openmatches[e.rowData.rowId];
var alertWindow = Titanium.UI.createAlertDialog({
title: 'Accept This Match?',
message: 'Are you sure you want to accept this match?' + '\n' + matchSelected.matchtype + '\n' + 'Time: ' + matchSelected.datetime + '\n' + 'At: ' + matchSelected.courtname,
cancel: 1,
buttonNames: ['Yes', 'Cancel']
});
alertWindow.addEventListener('click', function(ev) {
Titanium.API.info("cancel " + ev.cancel);
Titanium.API.info("index " + ev.index);
switch(e.source.action){
case 'swapImages':
break;
case 'swapImages':
imageView.image = 'images/nomatch.png';
break;
}
});
alertWindow.show();
} else {
//Logic for cancelling a match here
//Similar structure as above
}
});
tableview.setData(tableData);
My question is regarding how to structure my code so that it can efficiently handle interactions with each object within the row.