Thursday, April 16, 2009

Transparent Background on iPhone UIWebView

Well, Apple has hidden a little nugget in the docs that took me quite some time to dig up. Here's the simple solution to creating a UIWebView with a transparent background:
  • set your background color of the UIWebView to clear
  • set the css for the body to background-color: transparent
  • here's the bugger... set the opaque property of the UIWebView to NO

The code looks something like this:

UIWebView *w = [[UIWebView alloc] initWithFrame:CGRectMake(10, 10, self.bounds.size.width-20, self.bounds.size.height-60)];
[w setBackgroundColor:[UIColor clearColor]];
[w setOpaque:NO];
[self addSubview:w];
self.myWebView = w;
[w release];

And in the HTML:

body {
margin: 0;
padding: 0;
width: 220px;
background-color: transparent;
}

Hope that helps someone!

2 comments:

  1. Anonymous11:39 AM

    Another method:

    http://discussions.apple.com/message.jspa?messageID=8272419

    ReplyDelete
  2. Very cool. Thanks, this saved me tonight.

    ReplyDelete