imageview always center in tableview

Question

i have a appcelerator project, in IOS and Android.

The problem is when i need a tableview with a imageview inside the rows. In Android i can put the image1 near the left border, but in iOS imageview always is centered. Where is the problem????

Thanks

My Code:

for (i=0;i<NRegistros;i++){

    TablaSerieTermostatos[i]=rows.field(0);
    leoSerie=rows.field(0);
    TablaPinTermostatos[i]=rows.field(1);
    leoPin=rows.field(1);
    TablaNombreTermostatos[i]= rows.field(2);
    TablaTemperTermostatos[i]= rows.field(345);

    var nuevaRow=Ti.UI.createTableViewRow({height:200, backgroundSelectedColor: "white"});  

    var cuadroexterno=Ti.UI.createView({
        id: "CuadroExterno",
        backgroundColor: "white" ,
        height: "100%",
        width: "100%",
        left:"0%",
        top:"5%"
    });
    var titulo1=Ti.UI.createLabel({
        id: "NombreTerm",
        text: TablaNombreTermostatos[i],
        font: {fontSize: '27'},
        color: "#0060a7" ,
        textAlign: Ti.UI.TEXT_ALIGNMENT_LEFT, 
        left: "50%",
        top:"35%"
    });
    var imagen1=Ti.UI.createImageView({
        id: "Radiador",         
        image: "/Copiar Emisor.png",
        height: "70%",
        //left:"15%",
        top:"10%"
    });                 


    if (Ti.Platform.name=="iPhone OS") {
        imagen1.right = "40%";
        titulo1.left = "55%";
    }       
    else imagen1.left="15%";

    cuadroexterno.add(imagen1);
    cuadroexterno.add(titulo1);
    nuevaRow.add(cuadroexterno);        

    $.TablaCopiar.appendRow(nuevaRow);
    rows.next();
}       

Alloy:

    <TableView id="TablaCopiar" top="20%" height="80%" left="0%" zindex="20" width="100%" backgroundColor="white" visible="false" separatorColor="gray" >
    </TableView>

The screen in IOS

The screen in Android

Answer 1

Try this code after creating a new controller with name as TableRow:

var table_rows = [];

for (i=0;i<NRegistros;i++){
    TablaSerieTermostatos[i]=rows.field(0);
    leoSerie=rows.field(0);
    TablaPinTermostatos[i]=rows.field(1);
    leoPin=rows.field(1);
    TablaNombreTermostatos[i]= rows.field(2);
    TablaTemperTermostatos[i]= rows.field(345);

    table_rows.push(Alloy.createController('TableRow', {
        text : TablaNombreTermostatos[i]
    }).getView());  

    rows.next();
}       

$.TablaCopiar.data = table_rows;

TableRow.xml

<Alloy>
    <TableViewRow height="200" backgroundSelectedColor="white">
        <View class="views">
            <Label id="NombreTerm" class="row-labels" />
            <ImageView id="Radiador" class="left-images"/>
        </View>
    </TableViewRow>
</Alloy>

TableRow.tss

".views" : {
    width : Titanium.UI.FILL,
    height : Titanium.UI.FILL,
    backgroundColor : "white"
}

".left-images" : {
    left : 70,
    height : '70%',
    image : "/Copiar Emisor.png"
}

".row-labels" : {
    textAlign : Ti.UI.TEXT_ALIGNMENT_LEFT,
    color : "#0060a7",
    font: {fontSize: '27'}
}

TableRow.js

$.NombreTerm.text = $.args.text;