Differentiate between iPhone and iPad in Titaninum Appcelerator

appcelerator, appcelerator-mobile, titanium-mobile

Solution

You can do it a few ways, either in the index.xml file like this:

<Alloy>
    <Button formFactor="handheld" id="button">Click Me</Button>
    <Button formFactor="tablet" id="button">Submit</Button>
</Alloy>

Or in the index.js like this:

if(Alloy.isHandheld) {
    $.button.title = "Click Me";
}

if(Alloy.isTablet) {
    $.button.title = "Submit";
}

Or in the style file, index.tss like this:

"#button[formFactor=handheld]" : { 
    title : "Click Me"
},

"#button[formFactor=tablet]" : { 
    title : "Submit"
}

Problem

I am new to the cross platform Titanium SDK, and the Alloy MVC framework. I created a button inside index.xml like this: ``` <Alloy> <Button id="button">Click Me</Button> </Alloy> ``` But now I want to know how to display the title "Click Me" when on an iPhone, and display the title "Submit" when on an iPad. Where do I need to write the condition? In index.xml, index.js, or index.tss?

Original source