How Do I Properly Convert UIWebView with Chaning Content to UIImages

Question

What I'm trying to do is to convert UIWebView to UIImage every time the content of webview was changed/loaded.

Here is the code:

- (void)viewDidLoad {
    [self.tmpWebView loadHTMLString:[NSString stringWithFormat:@"Some %i HTML", 0,baseURL:nil];
}

- (void)webViewDidFinishLoad:(UIWebView *)webView {

    if (webView==tmpWebView && pngCount<[self.arrayOfHtmlContent count]) {
        UIGraphicsBeginImageContext(webView.frame.size);
        {
            [webView.layer renderInContext: UIGraphicsGetCurrentContext()];
            UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
            UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
            imageView.frame = CGRectMake(10, 10+((pngCount==1)?0:(pngCount-1)*100), 400, 200);
            [imageView setBackgroundColor:[UIColor redColor]];
            [_someScrollView addSubview:imageView];
            //NSString  *pngPath = [NSHomeDirectory() stringByAppendingPathComponent:[NSString stringWithFormat: @"Documents/Test-%i.png",pngCount]];
            //[UIImagePNGRepresentation(image) writeToFile:pngPath atomically:YES];
        }
        UIGraphicsEndImageContext();

        [self performSelector:@selector(loadWebViewWith:) withObject:[[NSArray alloc] initWithObjects:webView, [[NSNumber alloc] initWithInt:pngCount], nil ] afterDelay:0.3];//DELAY INCREASING DOES NOT CHANGE ANYTHING

        pngCount++;
        //NSLog(@"Finish%i: %@",(pngCount-1),[webView stringByEvaluatingJavaScriptFromString:@"document.body.innerHTML"]);
    }
}

- (void) loadWebViewWith:(NSArray*)array {
    [(UIWebView*)[array objectAtIndex:0] loadHTMLString:[NSString stringWithFormat:@"Another %i HTML", [[array objectAtIndex:1] intValue]] baseURL:nil];
}

I don't know why but some of created UIImages are duplicated. It maybe because of Thread, that did not finish converting to UIImage, but delay for starting loading new content of webview (even if I set it to 5secs) does not change anything.

Can anybody explain me why do I get duplicated UIImages?

Answer 1

I got it to work... The WebView must be added to ViewController.view. Apparently the reason is the priority of Main Thread...

So, here's the code:

- (void)viewDidLoad {

    pngCount = 0;

    [self.tmpWebView loadHTMLString:[NSString stringWithFormat:@"Some %i HTML", pngCount] baseURL:nil];

    [self.view insertSubview:self.tmpWebView atIndex:0];/////////
}

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    if (webView==self.tmpWebView && pngCount<[self.arrayOfHtmlContent count]) {

        [self performSelector:@selector(webViewToImage) withObject:nil afterDelay:0.05];

        [self performSelector:@selector(loadWebViewContent) withObject:nil afterDelay:0.1];
    }
}


- (void) webViewToImage {

    UIGraphicsBeginImageContext(self.tmpWebView.frame.size);
    {
        [self.tmpWebView.layer renderInContext: UIGraphicsGetCurrentContext()];
        UIImage* image = UIGraphicsGetImageFromCurrentImageContext();

        UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
        imageView.frame = CGRectMake(10, 110+((pngCount==1)?0:(pngCount-1)*100), 200, 90);
        [imageView setBackgroundColor:[UIColor clearColor]];

        UIControl *mask = [[UIControl alloc] initWithFrame:imageView.frame];

        imageView.frame = CGRectMake(0, 0, imageView.frame.size.width, imageView.frame.size.height);
        [mask addSubview:imageView];

        [mask addTarget:self action:@selector(showOnMainWebView:) forControlEvents:UIControlEventTouchUpInside];
        mask.tag = pngCount;

        [_someScrollView addSubview:mask];
    }
    UIGraphicsEndImageContext();

    pngCount++;
}

- (void) loadWebViewContent {

    if (pngCount < [self.arrayOfHtmlContent count]) {
        [self.tmpWebView loadHTMLString:[NSString stringWithFormat:@"Another %i HTML", pngCount] baseURL:nil];
    }
}

Answer 2

webViewDidFinishLoad: is called after the WebView finishes loading a frame. So those pages for which you get duplicates probably contain multiple frames.