iphone tabbar disappears in landscape mode

[Samir]

Hi

I have finally managed to get the tabbar working perfectly at the
bottom of the screen in portrait mode. However the tabbar seems to
disappear (leaving a 49px empty space) when I switch to landscape
mode. Does anyone know what I am doing wrong?

Thanks

Samir

[davidroe]

most likely scenario is that you have code that specifically sizes the
webview to position the tabbar below when in portrait mode only.
check the view controller for the notification that the orientation is
changing and resize the webview (and other controls) appropriately.

[mattvick]

Hi Samir,

I had a similar situation. When using PhoneGap 0.8.0 and also 0.9.0
when rotating to landscape the tab bar disappears leaving a blank
(black) area where it was at the bottom. If I position the tab bar at
the top then it stays when I rotate to landscape and not black box
appears.

I'm very new to Obj-C and my fix is very probably not the best way to
resolve this but it works and I have a deadline... anyway here's my
fix (code for 0.9.0, may work in 0.8.0 as well but I've not tested):

in PhoneGapViewController.h:

@interface PhoneGapViewController : UIViewController {
IBOutlet UIWebView *webView;
NSArray* supportedOrientations;
CGRect webViewBounds; // ADD THIS LINE
}

in PhoneGapViewController.m:

/**
Called by UIKit when the device starts to rotate to a new
orientation. This fires the \c setOrientation
method on the Orientation object in JavaScript. Look at the
JavaScript documentation for more information.
*/
- (void)willRotateToInterfaceOrientation:
(UIInterfaceOrientation)toInterfaceOrientation duration:
(NSTimeInterval)duration {
double i = 0;

switch (toInterfaceOrientation){
case UIInterfaceOrientationPortrait:
i = 0;
webViewBounds =
CGRectMake(0,0,webView.bounds.size.width,webView.bounds.size.height -
49); // ADD THIS LINE
break;
case UIInterfaceOrientationPortraitUpsideDown:
i = 180; // I'm not using upside down view so haven't added
anything here
break;
case UIInterfaceOrientationLandscapeLeft:
i = 90;
webViewBounds = CGRectMake(0,0,320,460); // ADD THIS LINE
break;
case UIInterfaceOrientationLandscapeRight:
i = -90;
webViewBounds = CGRectMake(0,0,320,460); // ADD THIS LINE
break;
}
[webView stringByEvaluatingJavaScriptFromString:[NSString
stringWithFormat:@"navigator.orientation.setOrientation(%f);", i]];
[webView setFrame:webViewBounds]; // ADD THIS LINE
}

Hope this resolves your issue as well.

If anyone can improve my code please feel free :-)

Regards, Matthew

--
You received this message because you are subscribed to the Google
Groups "phonegap" group.
To post to this group, send email to phon...@googlegroups.com
To unsubscribe from this group, send email to
phonegap+u...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/phonegap?hl=en?hl=en

For more info on PhoneGap or to download the code go to www.phonegap.com

[RonaldK]

Hi Matthew,

Your code works fine on an iPhone. I made it a bit more universal to
suit the iPad as well:

- (void)willRotateToInterfaceOrientation:
(UIInterfaceOrientation)toInterfaceOrientation duration:
(NSTimeInterval)duration {
double i = 0;

switch (toInterfaceOrientation){
case UIInterfaceOrientationPortrait:
i = 0;
webViewBounds =
CGRectMake(0,0,webView.bounds.size.width,webView.bounds.size.height -
49);

break;
case UIInterfaceOrientationPortraitUpsideDown:
i = 180;

webViewBounds =
CGRectMake(0,0,webView.bounds.size.width,webView.bounds.size.height -
49);

break;
case UIInterfaceOrientationLandscapeLeft:
i = 90;
webViewBounds =

CGRectMake(0,0,webView.bounds.size.width,webView.bounds.size.height +
49);

break;
case UIInterfaceOrientationLandscapeRight:
i = -90;
webViewBounds =

CGRectMake(0,0,webView.bounds.size.width,webView.bounds.size.height +
49);

break;
}
[webView stringByEvaluatingJavaScriptFromString:[NSString
stringWithFormat:@"navigator.orientation.setOrientation(%f);", i]];
[webView setFrame:webViewBounds];
}

I basically replaced the 320 and 460 values with the webview bounds
properties. That does the job on iPad when launched in portrait mode.

When iPad is launched in landscape mode, the tabbar is not displayed
in the right position. If anyone has a fix for that, please post it...

cheers,
Ronald

> For more options, visit this group athttp://groups.google.com/group/phonegap?hl=en?hl=en

[Pierreuno]

Hi everyone,

I'm starting my first app for iPad, and I met the problem everybody's
talking about:

when I launch the app, the tabbar is properly displayed but when I
switch the orientation, the tabbar disappears to leave a black area.
The tab bar is well displayed when the app is starting in landscape or
portrait mode. It is the fact that I change the rotation of the iPad
which make the problem. If I put the iPad back in the "start"
position, the tab bar comes back as it position.

I don't know how to fix that, any ideas ?

Thank you.

[Pierreuno]

So I think the problem comes from the fact the tabbar has a defined
position and not relative position because if I start the app in
landscape mode and switch to the portrait mode, the width between the
top of the screen and the tabbar stays the same as it was beore the
switch.

Could we do something like, every time the rotation is switch, remove
the tabbar and create a new one ?