How to make a transparent UIWebView
IosIphoneCocoa TouchUiwebviewIos Problem Overview
I have an app with a UITableView and a corresponding detail view for each row. In the detail view I have to display some text and a background image (text is different for each row, but the image remains the same). The easiest way, in my opinion, is to put the text in an .rtf file and display it in a UIWebView. Then just put a UIImageView behind the UIWebView.
I've tried to set the UIWebView's opacity to zero in IB, but it didn't help.
Can you help me?
Ios Solutions
Solution 1 - Ios
I recommend:
webView.opaque = NO;
webView.backgroundColor = [UIColor clearColor];
(setting these properties in Interface Builder will work for iOS 5.0+, but for iOS 4.3 you must set the backgroundColor in code)
And include this into your HTML code:
<body style="background-color: transparent;">
Solution 2 - Ios
Use the recursive method below to remove gradient from UIWebView:
[webView setBackgroundColor:[UIColor clearColor]];
[self hideGradientBackground:webView];
- (void) hideGradientBackground:(UIView*)theView
{
for (UIView * subview in theView.subviews)
{
if ([subview isKindOfClass:[UIImageView class]])
subview.hidden = YES;
[self hideGradientBackground:subview];
}
}
Solution 3 - Ios
Swift update:
webView.opaque = true
webView.backgroundColor = UIColor.clearColor()
And again, don't forget to set
<body style="background-color: transparent">
Or better still, instead of an inline style, in your style sheet:
body {
background-color: transparent
}
Solution 4 - Ios
For Swift 3 and Xcode 8
self.webView.isOpaque = false;
self.webView.backgroundColor = UIColor.clear
Solution 5 - Ios
In XCode 6.x uncheck Opaque and change Background's opacity to 0%. I think other XCode versions will also work.
Solution 6 - Ios
I was able to make my UIWebView transparent by going to 'Attributes Inspector' and unchecking Drawing Opaque.
My HTML code just for reference.
UIWebView* webView =(UIWebView *) [cell viewWithTag:100];
NSString* htmlContentString = [NSString stringWithFormat:
@"<html>"
"<style type='text/css'>html,body {margin: 0;padding: 0;width: 100%%;height: 100%%;}</style>"
"<body>"
"<table style='border:1px solid gray; border-radius: 5px; overflow: hidden;color:white;font-size:10pt' cellspacing=\"0\" cellpadding=\"1\" align='right'><tr>"
"<td>Hello</td><td>There</td>"
"</tr></table>"
"</body></html>"
];
[webView loadHTMLString:htmlContentString baseURL:nil];
Solution 7 - Ios
To remove the scrolls and make the UIWebView transparent, try this code below:
webView.opaque = NO;
webView.backgroundColor = [UIColor clearColor];
for(UIView *view in webView.subviews){
if ([view isKindOfClass:[UIImageView class]]) {
// to transparent
[view removeFromSuperview];
}
if ([view isKindOfClass:[UIScrollView class]]) {
UIScrollView *sView = (UIScrollView *)view;
//to hide Scroller bar
sView.showsVerticalScrollIndicator = NO;
sView.showsHorizontalScrollIndicator = NO;
for (UIView* shadowView in [sView subviews]){
//to remove shadow
if ([shadowView isKindOfClass:[UIImageView class]]) {
[shadowView setHidden:TRUE];
}
}
}
}
Solution 8 - Ios
In Swift 4.x,
webView.backgroundColor = .clear
openSourceLicensesWebView.isOpaque = false