I'm writing a Phonegap 3.0+ app.
There is an issue with the status bar overlapping views in iOS7 which user Ludwig Kristoffersson provided a working answer here
Now that I have UIWebView with a 20px top margin, how can I change the UIWebView background color? I need the area behind the status bar to be the same background color as the "people" toolbar.
I have almost no experience in Objective C, and have been looking through possible SO questions to find a working solution but with no success.
UIWebView background color
UIWebView background is set to Clear Color, but it is not transparent
Below is the code that I've tried so far:
- (void)viewWillAppear:(BOOL)animated {
//Lower screen 20px on ios 7
if([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 20;
viewBounds.size.height = viewBounds.size.height - 20;
self.webView.frame = viewBounds;
[self.webView setOpaque:YES];
//neither of these seem to work when uncommented:
// [self.webView setBackgroundColor:[UIColor grayColor]];
// self.webView.backgroundColor=[UIColor grayColor];
}
[super viewWillAppear:animated];
}
UPDATE 1
- (void)viewWillAppear:(BOOL)animated
{
//Lower screen 20px on ios 7
if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
CGRect viewBounds = [self.webView bounds];
viewBounds.origin.y = 20;
viewBounds.size.height = viewBounds.size.height - 20;
self.webView.frame = viewBounds;
self.webView.backgroundColor = [UIColor grayColor];
self.webView.opaque=NO;
}
[super viewWillAppear:animated];
}
That still seems to give me a white background behind the status bar, rather than gray.
The result I'm hoping for is like this:
Change the Opaque property to NO and check like this :
self.webView.backgroundColor = [UIColor grayColor];
self.webView.opaque=NO;
its working fine for me.
So I realized that the code pushes the UIWebView down 20px. Meaning that the white space by definition cannot be UIWebView. The white space is the main view which I changed the background color by doing the following:
1. Go to MainViewController.xib:
2. Select the main view:
3. Show the attributes inspector and change the color. Done.
Obvious now that I think about it, but hopefully this helps someone in future.
This is working for Cordova 3 and Cordova 2.9
So after you set your app's background color via CSS like this:
body{
background-color: #000;
}
Go to your CordovaXlib.xcode.proj and look for your "Classes" folder MainViewController.m line#142
Uncomment the "webViewDidStartLoad" method or function and just add
self.webView.opaque=NO;
So you will have something like this:
- (void) webViewDidStartLoad:(UIWebView*)theWebView
{
self.webView.opaque=NO;
return [super webViewDidStartLoad:theWebView];
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With