CODEWITHSUNDEEP
htmlioscssobjective-cwkwebview
RosaK
RosaK

Reputation: 41

iOS Transparent background for WKWebView

I'm in the process of migrating some code over from UIWebView to a WKWebView on a iOS project. I'm currently trying to make a wkwebview transparent but the functionality doesn't seem work. I could do this on a UIWebView by doing this

self.opaque = NO;  
self.backgroundColor = [UIColor clearColor];

and setting the html page to be transparent via styling would allow me to see the view content underneath.

If I try the same code on a WKWebView the background of the html page isn't becoming transparent. I've had search on google and there seems to be work around for MacOS X but I can't see to find a solution for iOS.

This is how it's done on a UIWebView (How to make a transparent UIWebView) Has anyone any ideas if this is possible?

Thank you.

Upvotes: 4

Views: 4806

Answers (2)

Chris Edgington
Chris Edgington

Reputation: 1467

This is exactly how our app works - we rely on the transparency. Our WkWebView is made transparent with this code:

_primaryWebView = [[WKWebView alloc] initWithFrame:frame configuration:theConfiguration];
_primaryWebView.opaque = false;
_primaryWebView.backgroundColor = [UIColor clearColor];

Our web content hosted in the WkWebView has a transparent background, then for the areas of the page where we want to see the native content we place DIV elements sized properly, with a transparent background. This allows us to easily combine HTML and native iOS content.

Upvotes: 4

ystack
ystack

Reputation: 1805

You can try out the following snippet:

webView.opaque = false
webView.backgroundColor = UIColor.clearColor()
webView.scrollView.backgroundColor = UIColor.clearColor()

Upvotes: 9

Related Questions