iOS WebView加载图片自适应屏幕的解决方案


这几天一直困扰我的一个问题,

WebView加载XML的时候,图片跟文字一直无法做到同时自适应,网上也找了很多方法,效果出来跟安卓的就是有差距;

另外,如果设置了下面这行代码:

_webView.scalesPageToFit = YES;

布局的样式,会优先选择尺寸最大的那一张图片适应屏幕,其他的图片保持原图显示,这样出来的效果如下图

 

所以,这样看起来会很不协调。其实,要做到图片自适应屏幕,也没有想像当中那么难,把 

_webView.scalesPageToFit = YES;这行代码注释掉,执行下面的代码就OK了

- (void)webViewDidFinishLoad:(UIWebView *)webView

{

    NSString *js = @"function imgAutoFit() { \

    var imgs = document.getElementsByTagName('img'); \

    for (var i = 0; i < imgs.length; ++i) {\

    var img = imgs[i];   \

    img.style.maxWidth = %f;   \

    } \

    }";

    js = [NSString stringWithFormat:js, [UIScreen mainScreen].bounds.size.width - 20];

    

    [webView stringByEvaluatingJavaScriptFromString:js];

    [webView stringByEvaluatingJavaScriptFromString:@"imgAutoFit()"];

}

运了出来的效果是下面这样的,完成解决

 

 

 

喜欢的,点个赞!

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM