WebView显示图片适配屏幕宽度
WebView显示图片适配屏幕宽度
1025645
发布于 2018-08-23 11:26:49
发布于 2018-08-23 11:26:49
首先必须吐槽一下后台返回的Url网页HTML代码太坑：
情景一、WebView加载url
图片直接就是标签出来的，还是一张巨大的图片，直接导致webview加载只有截取了屏幕大小的宽度，看不到整张图片，测试要求适配屏幕宽度。于是有了这篇博客记录一下,在Webview的setWebViewClient（）方法中WebViewClient中在加载完网页后执行一个JavaScript方法，这个JavaScript方法将所有网页中图片的宽度设置为屏幕显示宽度。
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
String javascript = "javascript:function ResizeImages() {" +
"var myimg,oldwidth;" +
"var maxwidth = document.body.clientWidth;" +
"for(i=0;i <document.images.length;i++){" +
"myimg = document.images[i];" +
"if(myimg.width > maxwidth){" +
"oldwidth = myimg.width;" +
"myimg.width = maxwidth;" +
"}" +
"}" +
"}";
String width = String.valueOf(ScreenUtils.widthPixels(mContext));
view.loadUrl(javascript);
view.loadUrl("javascript:ResizeImages();");
}情景二、WebView直接加载HTML代码
这里还记载一种以前遇到的情况，就是接口返回一段HTML方法，需要我们把这段HTML方法放在WebView中显示出来，也会有图片需要适配屏幕宽度的需求，这里的解决方法就简单多了，毕竟我们可以拿到HTML代码处理。
String content = ".....<........>......</......>.....";//后台接口返回的需要在WebView中显示的HTML代码
content = content.replace("<img", "<img style=\"display: ;max-width:100%;\"");
webView.loadDataWithBaseURL(null, content, "text/html", "utf-8", null);本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2017.03.21 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录