UIVisualEffects, UIWebView transparent background

Question

I am using Cordova to build a iOS app. I want my webview to be transparent and behind it the blurred background of user wallpaper. Like the ios reminder app.

I know it's a common question but I did not found specify replies

Is it possible ?

In my viewDidLoad method I added these lines:

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.view.backgroundColor = [UIColor clearColor];

    UIBlurEffect *blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];
    UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
    blurEffectView.frame = self.view.bounds;
    blurEffectView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;

    //This line places a dark black background with my app being blurred behind it
    [self.view addSubview:blurEffectView];

    //This line instead just makes background of app plain black (the body of html app is transparent)  and not blurred , I guess there is something wrong with view hierarchy maybe? 
    [self.view addSubview:self.webView];


    [self.webView setOpaque:NO];
    [self.webView setBackgroundColor:[UIColor clearColor]];
}

Thanks in advance

Answer 1

The order of setting webview background color and opaqueness should be like this

[self.webView setBackgroundColor:[UIColor clearColor]];
[self.webView setOpaque:NO];