Search code examples
iosobjective-cuitableviewuiwebview

iOS - UIWebview Partial Disappear on Scroll

I've implemented a custom header view that is not part of a UITableView. However, it responds to scrollView delegate methods to adjust the NSLayoutConstraint constant of it's height. The header view contains a web view that renders a static image. The header view moves on and off the screen as expected during tableView scrolling. When scrolling is fast (up/down) it works as expected. However, if you scroll down slowly the content of the UIWebview disappears. enter image description here

I had initially thought it may have something to do with the webView's scrollView.contentSize but that seems to be adjusting correctly (based on NSLog). If you take a look at the above gif, the orange is the background of the UIWebview, so only the actual content of the html is vanishing; the view itself is intact. Anyone else run into this issue?

Relevant code:

#define kMaxHeaderHeight 160.0
#define kMinHeaderHeight 0.0
-(void)setupWebview
{
    self.webView.scrollView.scrollEnabled = false;
    self.webView.backgroundColor = [UIColor orangeColor];

    NSString *html =
    @"<head>"
    @"<style>"
    @"body {"
    @"padding: 0px;"
    @"font-family: Arial;"
    @"width: 100%;"
    @"margin: 0px;"
    @"text-align: center;"
    @"}"
    @".image {"
    @"position: absolute;"
    @"margin: 0px;"
    @"bottom: 0;"
    @"padding: 0px;"
    @"}"
    @"</style>"
    @"</head>"
    @"<body>"
    @"<a>"
    @"<img class='image' src='http://mgk.com/wp-content/uploads/2013/05/bedbug_ICON.png' />"
    @"</a>"
    @"</body>";

    [self.webView loadHTMLString:html baseURL:nil];
}
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    if (scrollView != self.tableView) return;

    CGFloat scrollDiff = scrollView.contentOffset.y - previousScrollOffset;
    CGFloat absoluteTop = 0.0;
    CGFloat absoluteBottom = scrollView.contentSize.height - scrollView.frame.size.height;
    BOOL isScrollingDown = scrollDiff > 0 && scrollView.contentOffset.y > absoluteTop;
    BOOL isScrollingUp = scrollDiff < 0 && scrollView.contentOffset.y < absoluteBottom;

    CGFloat newHeight = self.headerViewHeightConstraint.constant;
    if (isScrollingDown) {
        newHeight = MAX(kMinHeaderHeight, self.headerViewHeightConstraint.constant - fabs(scrollDiff));
    } else if (isScrollingUp) {
        newHeight = MIN(kMaxHeaderHeight, self.headerViewHeightConstraint.constant + fabs(scrollDiff));
    }

    if (newHeight != self.headerViewHeightConstraint.constant) {
        self.headerViewHeightConstraint.constant = newHeight;
        [self updateScrollPosition:previousScrollOffset];
    } 



    previousScrollOffset = scrollView.contentOffset.y;
}

-(void)updateScrollPosition:(CGFloat)postition
{
    self.tableView.contentOffset = CGPointMake(self.tableView.contentOffset.x, postition);
}

What I've tried:

  • forcing the webview to layoutSubviews [self.webView layoutSubViews];
  • collecting all subviews of UIWebview into an array and adjust their height as the scrolling happens.
  • adjusting the contentView of the webView.scrollView as scrolling happens.
  • a bunch of other stuff i can't remember. suggest something and I'll tell you if i've tried it.
Solution

  • OP was able to resolve the issue by using WKWebView instead of UIWebView.