PDA

View Full Version : Orientation change issue using Sencha Touch and PhoneGap



pras_mi
28 Jul 2011, 12:41 AM
Hi,

Using Sencha Touch for making UI we are facing the following issues:
1> In android the screen is getting refreshed on orientation change
2> In iPhone/iPad the screen is getting rotated properly but it doesn't occupy while 100% of the available width, a white column appears at the right hand side of the screen.

Please provide your inputs to fix this issue. Or in worst case how can we disable screen's orientation change as long as our application is running. We are using PhoneGap 0.9.5.1 and Sencha Touch 1.1.0 .

Thanks In Advance
-Prashant

jjerome
28 Jul 2011, 9:36 AM
I had a similar problem to this where when I changed the orientation of my application, the screen would not resize correctly and I would lose half the window.

This is how I fixed it:

add this to your main viewport component as a config option:



listeners: {
orientationchange: function(){
window.scrollTo(0,0);
Ext.getCmp('viewport').doLayout();
//this references the viewport component. change this to
//your own reference
}
}
Also, create an override to the orientationchange event:



Ext.Viewport.override({
scrollToTop: function() {
if (Ext.is.iOS) {
if (Ext.is.Phone) {
document.body.scrollTop = 0;
//was "document.body.scrollHeight;", instead of 0 as it is now.
}
}
else if (Ext.is.Blackberry) {
window.scrollTo(0, 1000);
}
else {
window.scrollTo(0, 1);
}
}
});
if all fails, you can force an orientation on your application by editing the android manifest.xml
or
try this in your application:


Ext.setup({
onReady: function() {
Ext.EventManager.onWindowResize(setActivePanel);
}
});

function setActivePanel(){
panel.setOrientation( Ext.getOrientation() , window.innerWidth , window.innerHeight );
//the 'panel' variable should be referenced to your main viewport component.
//so you will have to configure this to be referenced correctly.
};
good luck

Hertz
28 Jul 2011, 12:15 PM
I developed and app (iOS only) which has gone through a lot of updates.
And it has used Phonegap 0.9.4 through 0.9.6.

When it used 0.9.5.1, it had problems responding to orientation changes. As soon as I updated to 0.9.6, everything went back to normal.

Most, if not all of the orientation problems have been fixed in the latest Phonegap release, and v1.0 is coming out tomorrow I believe.