PDA

View Full Version : Different Views for Ipad/Iphone



Voyd
13 Sep 2011, 3:41 PM
I was wondering if there is an example where an application will load a separate sets of views based on the type of device. I am looking into UI design patterns for an Ipad versus an iphone and I want to be able to display different looks accordingly. I am using MVC style architecture. Obviously, all my applications look the same on any device but of course, stretched/shrunk to fit. Any guidance in this would be appreciated.

stefanlaketa
14 Sep 2011, 3:55 AM
I have done something like this.
In your Ext.regApplication, add a profiles config:



Ext.regApplication({
name: 'TheApp',
profiles: {

iPhone: function() { return Ext.is.iPhone; },
iPad: function() { return Ext.is.iPad; }

},
launch: function() {}
});


(Ext.is has a lot of other properties, check the API docs.)

The you can in a Container or Panel etc check what profile is in use:



if ( MyApp.getProfile() == "iPad" )
use iPad formatted view
else if ( MyApp.getProfile() == "iPhone" )
use iPhone formatted view