UIWebView render speeds and white background

schipmolder · 10-09-2008, 06:02 AM

Hi guys,

I'm having a bit of a problem using UIWebView's to present formatted text in my app.

At first I wanted to use an UITextView to do this, but from the class ref I understand this won't work as my text will need multiple styles:

"This class does not support multiple styles for text. The font, color, and text alignment attributes you specify always apply to the entire contents of the text view. To display more complex styling in your application, you need to use a UIWebView object and render your content using HTML."

Now I've changed it to a webview and am loading a string with HTML code into the view, but I understand the webView can't have a transparent background...
So then I added a background in the HTML code (CSS style for body) that matches the containing view's background so it would appear transparent.

This is where I noticed the UIWebView taking quite some time (~0.5 sec) to render the HTML, even when it's very simple code. This in itself is not too bad, but while it's rendering the webView appears white!

Does anyone know what I can do to either not how the view until it's done rendering, or to make the background transparent?
I don't think the webview has a method it calls when finished rendering, right?

Thanks
Skip

jsm174 · 10-09-2008, 08:19 AM

I had the same issue.

Basically, I make my view with a black background, and then add a hidden UIWebView to it. When you set the UIWebView's delegate to your view, after the page finishes loading it will call webViewDidFinishLoad.

From there I delay an additional .2 because in my page I have some jQuery that takes a little bit to kick in.

Code:

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    [self performSelector:@selector(showAboutWebView) withObject:nil afterDelay:.2];          
}

- (void)showAboutWebView {
	[aboutWebView setHidden:NO];
}

-- Jason

schipmolder · 10-09-2008, 08:59 AM

Brilliant Jason, that did the trick.
I completely forgot to check the UIWebViewDelegate protocol... argh.

I just can't believe Apple has made it so complicated to format some text!

Thanks
Skip

AwayBBL · 10-19-2008, 11:48 AM

Jason,

I tried your method, but I must be missing something...

I have a Default.png that shows when my app starts up, then the screen goes blank, then the webview shows. That "blank time" is driving me batty. Is there an easy way to keep the Default.png showing until the webapp is finished loading, without that annoying "blank time"?

I've tried ... to no avail...

- (void)webViewDidFinishLoad

UIWebView *)webView {
[window makeKeyAndVisible];
}

and ...

- (void)webViewDidFinishLoad

UIWebView *)webView {
[webView setHidden:NO];
}

schipmolder · 10-19-2008, 12:00 PM

I had similar issues that were resolved when using the delay from Jason's post.
Just make sure you set the delegate of the webView to self and have a look if this works.

Quote:

- (void)webViewDidFinishLoad

UIWebView *)webView {
[self performSelector:@selector(showWebView) withObject:nil afterDelay:.1];
}

- (void)showWebView {
[window makeKeyAndVisible];
[webView setHidden:NO];
}

If not, try adding a NSLog in the showWebView to see if this is called properly.

AwayBBL · 10-19-2008, 05:33 PM

Quote:

Originally Posted by schipmolder

I had similar issues that were resolved when using the delay from Jason's post.
Just make sure you set the delegate of the webView to self and have a look if this works.

If not, try adding a NSLog in the showWebView to see if this is called properly.

schipmolder,

nope, same effect... maybe it's something in my delegates config... I've messed with them so much that I think I'll be better off starting from scratch. NSLog shows those being activated, but still see the blank screen between default.png and actual content.

When you say make the delegate of the webView set to self, how do I do that? right now its set to the view controller.

csmithmaui · 10-19-2008, 05:43 PM

I just made a webview transparent the other day.

Here is what I did:
first set the background color of the webview to clear:
myWebView.backgroundColor = [UIColor clearColor];

then in your html file use css syntax:
<body style="background-color:transparent">

I actually did it in the <head> section but that should work too.
Hope that helps you...it worked for me.

csmithmaui

DenNukem · 10-19-2008, 06:31 PM

Quote:

Originally Posted by csmithmaui

first set the background color of the webview to clear:
myWebView.backgroundColor = [UIColor clearColor];

then in your html file use css syntax:
<body style="background-color:transparent">

I actually did it in the <head> section but that should work too.
Hope that helps you...it worked for me.

csmithmaui

It works! Thanks!

Glass · 12-04-2008, 12:36 AM

Quote:

Originally Posted by csmithmaui

I just made a webview transparent the other day.

Here is what I did:
first set the background color of the webview to clear:
myWebView.backgroundColor = [UIColor clearColor];

then in your html file use css syntax:
<body style="background-color:transparent">

I actually did it in the <head> section but that should work too.
Hope that helps you...it worked for me.

csmithmaui

Does this still work in 2.2? I tried it in the simulator and on the device, I can't get it to work on any of them.

I got:

Code:

[self setHeaderStr:[[NSMutableString alloc] initWithString:@"<html>...<body style=\"background-color:transparent;\">"]];

Code:

[webView setBackgroundColor:[UIColor clearColor]];
[webView setDelegate:self];
[webView loadHTMLString:[NSString stringWithFormat:@"%@%@", headerStr, bodyStr] baseURL:[NSURL URLWithString:@"..."]];

Julinar · 12-10-2008, 03:51 PM

I had some mixed success with this. Setting the background to transparent in the html code and using a clear bground for the webview, I was able to see the page correctly all the time in the simulator, running 2.1.

If I ran the code on the device, still using 2.1, the webview wouldn't display any contents until I went back a screen, and then reloaded the page. This works everytime, but is clearly not acceptable.

I've tried allocating the webview, setting it to hidden, and then unhiding it when the page has loaded - I can see the NSLog reporting that its loaded, and the view shows up. Then each time I would release the view when done. I've also tried never setting it to hidden - same thing.

I've tried a ton of permutations with the HTML code. I've tried setting the body, html css properties in the <head> to make the background transparent. I've validated the document using strict xhtml standards. I've tried evaluating the document object model property for background as an expression and assigning it that way, and the simple body tag attribute. All produce the same results.

In 2.2, a white background appears when using a transparent background - both on the device, and in the simulator.

Going back to 2.0, I see no diff. between that and 2.1 where this feature is concerned.

Any takers?

EDIT
___________________
The 2.1 solution was to compress the code in the HTML document. I'm not sure why that made a difference with the background -- it always displayed correctly with a color background, just not with transparency.

2.2 still doesn't work.