Design for Multiple devices in sencha touch 2

Situation will occur, where you need to use the same code base for both tablet as well as mobile devices and also different types of mobile devices (android, iphone, blackberry etc).

Sencha touch 2 allows you to get the currrent device information using Ext.os. Using this feature, you can implement device specific functionality using sencha touch 2.

In sencha touch 2, if you need to check the generic type of current device.

Here is the sample code

if(Ext.os.deviceType == 'Tablet' || Ext.os.deviceType == 'Desktop'){

  //tablet specific code

}else{

  //mobile specific code

}

Possible Values are :-

• Tablet
• Desktop
• Mobile

Sencha Touch 2 also provides a provision to check the current device OS Name using Ext.os.is.

Here is the sample code

if(Ext.os.is.Android){

  //android specific code

}else if(Ext.os.is.iPhone){

  //iphone specific code

}else if(Ext.os.is.BlackBerry){

  //Blackberry specific code

}else if(Ext.os.is.Windows){

  //windows specific code

}

Possible Values are :-

• iOS
• iPad
• iPhone
• iPhone5 (also true for 4in iPods).
• iPod
• Android
• WebOS
• BlackBerry
• Bada
• MacOS
• Windows
• Linux
• Other

Hope you enjoyed this post