Cell 嵌套 WebView 高度及宽度计算解决办法(完美版)

此方法适用于CollectionView,tableView
解决了以下几个问题

• 解决了由于WebView中图片过大或者过小而显示不全的问题
• 解决了循环刷新CollectionView,tableView的问题
• 解决了高度计算不准确的问题

转载请注明出处

无循环刷新问题,性能良好

性能良好

性能良好

NSString+js.h

//by:HQ
#import "NSString+js.h"

/**
 宽度计算

 @param width 屏幕宽度
 @return 宽度
 */
+ (instancetype)getJSWithScreentWidth:(CGFloat) width;


/**
 高度计算

 @param webView
 @return 高度
 */
+ (instancetype)getJSWithScreentHeightWithWebView:(UIWebView*)webView;
@end

NSString+js.m

//by:HQ
#import "NSString+js.h"

@implementation NSString (js)
//宽度计算
+ (instancetype)getJSWithScreentWidth:(CGFloat) width{
    NSString *path = [[NSBundle mainBundle] pathForResource:@"webviewDeal.js" ofType:nil];
    NSString *js = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:NULL];
    return [NSString stringWithFormat:@"%@ \n autoSizeFit(%@);",js,[NSString stringWithFormat:@"%.2f",width]];
}
//高度计算
+ (instancetype)getJSWithScreentHeightWithWebView:(UIWebView *)webView{
    CGFloat height =[[webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].scrollHeight"] floatValue];
    return [NSString stringWithFormat:@"%f",height];
}
@end

计算宽度核心代码

新建一个.js文件,把代码复制进去(例如:webviewDeal.js)

//  by HQ

var autoSizeFit = function(screenWidth){
    //1.设置所有字体
    var body = document.getElementsByTagName("body")[0];
    //设置body的宽度
    body.style.width = screenWidth;
    //设置body的字体
    var bodyStyleFontSize = body.style.fontSize;
    //设置整个body的宽度
    var bodyStyleWidth = body
    if(bodyStyleFontSize.length<=0){
        document.getElementsByTagName("body")[0].style.fontSize = 14;
    }
    
    //2获取table的宽度
    var tables = document.getElementsByTagName("table");
    for(var i=0;i

如何使用?

//by:HQ
#pragma mark - UIWebViewDelegate
-(void)webViewDidFinishLoad:(UIWebView *)webView{
   //注入js,设置宽度
    NSString *jsStr = [NSString getJSWithScreentWidth:kSCREEN_WIDTH-35];
   [webView stringByEvaluatingJavaScriptFromString:jsStr];
   
  //获取高度
    CGFloat height = [NSString getJSWithScreentHeightWithWebView:webView].floatValue;
//获取模型的高度,判断模型中的高度是不是WebView的高度,如果不是则赋值给模型,赋值给模型后,高度相等,不在进入判断语句内,不再出现循环刷新问题
  ProductInfo * productInfo = self.concroteDetailsModel.productInfo;
    if (height!=productInfo.descriptionCellHigh) {
        productInfo.descriptionCellHigh  = height;
        [self.collectionView reloadSections:[NSIndexSet indexSetWithIndex:4]];
    }
    
}