美文网首页
完美方案——iOS的WebView自适应内容高度

完美方案——iOS的WebView自适应内容高度

作者: EnjoyWT | 来源:发表于2017-01-22 16:00 被阅读92次

    [原文][1]
    [1]:http://www.tuicool.com/articles/FNrIbmi

    /////////////////////////////初始化,self.view是父控件/////////////////////////////////
        _webView = [[UIWebView alloc] initWithFrame: CGRectMake(0, 0, self.view.frame.size.width, 0)];
        _webView.delegate = self;
        _webView.scrollView.bounces = NO;
        _webView.scrollView.showsHorizontalScrollIndicator = NO;
        _webView.scrollView.scrollEnabled = NO;
        [_webView sizeToFit];
    
        ///////////////////////////////设置内容,这里包装一层div,用来获取内容实际高度(像素),htmlcontent是html格式的字符串//////////////   
        NSString * htmlcontent = [NSString stringWithFormat:@"<div id=\"webview_content_wrapper\">%@</div>", htmlcontent];
        [_webView loadHTMLString:htmlcontent baseURL:nil];
    
        ////////////////////////////////delegate的方法重载////////////////////////////////////////////
    - (void)webViewDidFinishLoad:(UIWebView *)webView
    {
        //获取页面高度(像素)
        NSString * clientheight_str = [webView stringByEvaluatingJavaScriptFromString: @"document.body.offsetHeight"];
        float clientheight = [clientheight_str floatValue];
        //设置到WebView上
        webView.frame = CGRectMake(0, 0, self.view.frame.size.width, clientheight);
        //获取WebView最佳尺寸(点)
        CGSize frame = [webView sizeThatFits:webView.frame.size];
        //获取内容实际高度(像素)
        NSString * height_str= [webView stringByEvaluatingJavaScriptFromString: @"document.getElementById('webview_content_wrapper').offsetHeight + parseInt(window.getComputedStyle(document.getElementsByTagName('body')[0]).getPropertyValue('margin-top'))  + parseInt(window.getComputedStyle(document.getElementsByTagName('body')[0]).getPropertyValue('margin-bottom'))"];
        float height = [height_str floatValue];
        //内容实际高度(像素)* 点和像素的比
        height = height * frame.height / clientheight;
        //再次设置WebView高度(点)
        webView.frame = CGRectMake(0, 0, self.view.frame.size.width, height);
    }
    

    相关文章

      网友评论

          本文标题:完美方案——iOS的WebView自适应内容高度

          本文链接:https://www.haomeiwen.com/subject/kuuduttx.html