iOS-UIWebView加载html，文字大小颜色设置，图片自适应设置

最新推荐文章于 2023-05-04 23:02:17 发布

icefishlily

最新推荐文章于 2023-05-04 23:02:17 发布

阅读量4k

点赞数

分类专栏： iOS 文章标签： iOS UIWebView html 图片解决方案

本文链接：https://blog.csdn.net/icefishlily/article/details/70053779

版权

iOS 专栏收录该内容

72 篇文章 1 订阅

订阅专栏

UIWebView加载html，遇到了文字大小、颜色不符合要求的问题，而且图片也不能设置宽高。

经过多次尝试（UITextView代替尝试），终于有了解决方案：修改html源码，在其中加入font-size等的设置。

代码如下：代码思路是，把源代码中的所有font-size设置都删掉，然后把原html放在一个body里，再整体设置body的font-size等属性

//修改answer中的字号／边距／颜色，设置图片大小适应屏幕
        NSString *answer = 你的html代码;
        NSRange range = [answer rangeOfString:@"font-size:"];
        if (range.location == NSNotFound) {
            NSLog(@"can not change fontsize!");
        } else {
            NSArray*sourcearray = [answer componentsSeparatedByString:@"font-size:"];
            NSMutableArray *bigArray = [NSMutableArray arrayWithArray:sourcearray];
            
            for (int i=1; i<bigArray.count; i++) {
                NSArray *minArray = [bigArray[i] componentsSeparatedByString:@"px"];
                if (minArray.count < 2) {
                    minArray = [bigArray[i] componentsSeparatedByString:@"pt"];
                }
                if (minArray.count < 2) {
                    minArray = [bigArray[i] componentsSeparatedByString:@"em"];
                }
                bigArray[i] = minArray[1];
            }
            answer = @"";
            for (NSString *subStr in bigArray) {
                answer = [answer stringByAppendingString:subStr];
            }
        }
        
        //设置字体大小为14，颜色为0x666666，边距为18，并且图片的宽度自动充满屏幕，高度自适应
        NSString *htmls = [NSString stringWithFormat:@"<html> \n"
                           "<head> \n"
                           "<style type=\"text/css\"> \n"
                           "body {margin:18;font-size:14;color:0x666666}\n"
                           "</style> \n"
                           "</head> \n"
                           "<body>"
                           "<script type='text/javascript'>"
                           "window.onload = function(){\n"
                           "var $img = document.getElementsByTagName('img');\n"
                           "for(var p in  $img){\n"
                           " $img[p].style.width = '100%%';\n"
                           "$img[p].style.height ='auto'\n"
                           "}\n"
                           "}"
                           "</script>%@"
                           "</body>"
                           "</html>",answer];

        self.htmlWebView.scalesPageToFit=YES;
        [self.htmlWebView loadHTMLString:htmls baseURL:nil];

这样之后，就需要动态计算出UIWebView的高度，在webView的delegate里，计算高度，代码如下：

- (void)webViewDidFinishLoad:(UIWebView *)theWebView
{
    CGFloat scrollHeight = [[theWebView stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight"] floatValue];

    [self.htmlWebView mas_updateConstraints:^(MASConstraintMaker *make) {
        make.height.equalTo(@(scrollHeight));
    }];
}

即在加载完成之后，再计算真实高度。