margintitanium-mobiletitanium-alloytitanium-android

margin property for Alloy element in Titanium


I have an Alloy item template for row in listview as below. I want to layout 3 labels in row in vertically and margin-top 5dp each others. How can I do that for both Android and iOS?

<Templates>
   <ItemTemplate name="row" height="100dp">
         <Label bindId="name"/>
         <Label bindId="weight"/>
         <Label bindId="distance"/>
   </ItemTemplate>
</Templates>

Solution

  • In your xml file, adjust it like so

    <Templates>
       <ItemTemplate id="templateRow" name="row" height="100dp">
             <Label id="name" bindId="name"/>
             <Label id=weight" bindId="weight"/>
             <Label id="distance" bindId="distance"/>
       </ItemTemplate>
    </Templates>
    

    In your tss file:

    "#templateRow":{
         layout: "vertical"
    },
    "#name":{
        top: '5dp',
    },
    "#weight":{
        top: '5dp'
    },
    "#distance":{
        top: '5dp'
    }
    

    Alternatively:

    <Templates>
       <ItemTemplate layout="vertical" name="row" height="100dp">
             <Label bindId="name" top="5dp"/>
             <Label bindId="weight" top="5dp"/>
             <Label bindId="distance" top="5dp"/>
       </ItemTemplate>
    </Templates>