WebView中实现延迟加载,图片点击时才加载。
1 String newHtml = html + 2 "<script type=\"text/javascript\">" + 3 "(function (){"+ 4 "var imageList = document.getElementsByTagName(\"img\");"+ 5 "for(var i=0; i<imageList.length; i++){"+ 6 "var image = imageList[i];"+ 7 "image.href = image.src;"+ 8 "image.src = \"content://com.example.demo/res/def.jpg\";"+ 9 "image.alt = \"点击加载图片\";"+ 10 "image.onclick = function(){"+ 11 "this.src = this.href;" + 12 "return false;"+ 13 "}"+ 14 "}"+ 15 "}());"+ 16 "</script>";
17 mWebView.getSettings().setJavaScriptEnabled(true);
18 mWebView.loadData(newHtml, "text/html; charset=UTF-8", null);
以上的代码是在获取到的html页面后面添加一个自动执行的js函数,把所有图片标签的地址替换为一个占位图,当图片被点击时再加载真实的图片。
要加载应用自带的图片,我们可以用ContentProvider来实现。在com.example.demo.provider包目录下创建一个ContentProvider,重写openAssetFile方法来获取Assets文件夹里的占位图,然后在AndroidManifest.xml里注册ContentProvider。
1 @Override 2 public AssetFileDescriptor openAssetFile(Uri uri, String mode) 3 throws FileNotFoundException { 4 String fileName = uri.getLastPathSegment(); 5 try { 6 return getContext().getAssets().openFd(fileName); 7 } catch (IOException e) { 8 e.printStackTrace(); 9 return super.openAssetFile(uri, mode); 10 } 11 }
1 <provider 2 android:name="com.example.demo.database.ImageContentProvider" 3 android:authorities="com.example.demo" />
但是这个方法只能用在Android4.4以下的版本,4.4以后的版本换了WebView的内核后这个办法就无效了。所以我们可以用WebViewClient中一个API11开始提供的一个接口shouldInterceptRequest来实现拦截。
1 public WebResourceResponse shouldInterceptRequest(WebView view, 2 String url) { 3 WebResourceResponse response = null; 4 if (url.contains("def.jpg")) { 5 try { 6 InputStream image = getAssets().open("def.jpg"); 7 response = new WebResourceResponse("image/jpeg", "UTF-8", image); 8 } catch (IOException e) { 9 e.printStackTrace(); 10 } 11 } 12 return response; 13 }
最省事的话就是随便找个云储存,自己上传一张图片到上面。然后用这张图片的URL作为占位图,反正WebView会自动缓存数据,所以这张图片只会读取一次。
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。