Appcelerator Titanium tableviewrow rightImage not working on Android device

Question

I am new to Titanium.

I have a tableview displaying some data. I have added an event listener on each row to toggle the display of the check image (rightImage) like this:

row.addEventListener('click', function(e){
    if(e.row.getHasCheck()){
            e.row.setHasCheck(false);
            e.row.rightImage = 'android/images/blank.png';
            e.rowData.rightImage = 'android/images/blank.png';
        } else {
            e.row.setHasCheck(true);
            e.row.rightImage = 'android/images/check.png';
            e.rowData.rightImage = 'android/images/check.png';
        }
    });

• The images click.png and blank.png are in the folder: project/Resources/android/images (density independent)

• I have tried both e.row.rightImage as well as e.rowData.rightImage since both are mentioned in several other questions.

• The Android manifest in my tiapp.xml looks like this:

  <android xmlns:android="http://schemas.android.com/apk/res/android">
      <manifest>
          <supports-screens 
              android:smallScreens="true"
              android:normalScreens="true"
              android:largeScreens="true"
              android:anyDensity="true"
          />
      </manifest>
  </android>
  

• I am running Titanium 2.1.2GA on Ubuntu Linux and testing the app on Android 2.3.6 device with a 240 x 320 pixels display

• The only relevant part in the adb logcat is :

  I/InputReader( 1490): dispatchTouch::touch event's action is 0
  I/InputDispatcher( 1490): Delivering touch to current input target
  I/InputReader( 1490): dispatchTouch::touch event's action is 1
  I/InputDispatcher( 1490): Delivering touch to current input target
  

  Nothing unusual, no warnings, errors, etc.

Problem: The toggle (check/uncheck) works perfectly fine on the Android emulator (actually it works fine right out of the box on emulator, even without the custom image) but it fails to work (fails to display the row.rightImage) on device in any case.

Any help is appreciated.

Answer 1

I was able to make it work later.

within the for loop

var row = Titanium.UI.createTableViewRow({
    //I was dealing with contacts
    title : contacts[i].fullName + ", "+ contacts[i].phone.mobile[j], 
    rightImage : 'images/blank.png'
    });
row.addEventListener('click', function(e) {
    if(e.row.getHasCheck()){
        e.row.setHasCheck(false);
        e.row.setRightImage('images/blank.png');            
    } else {
        e.row.setHasCheck(true);
        e.row.setRightImage('images/check.png');            
    }
});
tableData.push(row);

not much change but the image paths.

Answer 2

Try this sample code to change the right image of a row

Ti.UI.backgroundColor = 'white';
var win = Ti.UI.createWindow();

var tableData = [];

for(var index = 1; index<= 10; index++)
{
    var row = Titanium.UI.createTableViewRow({
        title       : 'row '+ index, 
        rightImage  : 'images/blue.png'
    });


    tableData.push(row);
}
var table = Ti.UI.createTableView({
    data: tableData
});

table.addEventListener('click', function(e){
        image = 'images/black.png';
        e.source.setRightImage(image);
});
win.add(table);

win.open();

NOTE: I've added the eventListener to the tableView instead of row.