最近维护一个新闻相关APP,新闻详情是h5写的,后台新闻编辑的工具就是一个简单的编辑器,所有的图片操作居中之类的都需要客户自己操作,唉,不智能啊,苦了我们前端开发.
言归正传,问题就是客户上传的图片小,这边不处理的话就居右显示,特丑,,,,处理的方法如下所示,完美解决..
webView.setWebViewClient(new WebViewClient() { public boolean shouldOverrideUrlLoading(WebView view, String url) { // 重写此方法表明点击网页里面的链接还是在当前的webview里跳转,不跳到浏览器那边 view.loadUrl(url); return true; } @Override public void onPageFinished(WebView view, String url) { view.getSettings().setJavaScriptEnabled(true); super.onPageFinished(view, url); addImageClickListner(view); Tools.dismissWaitDialog(); } @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { view.getSettings().setJavaScriptEnabled(true); super.onPageStarted(view, url, favicon); } @Override public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) { Tools.dismissWaitDialog(); super.onReceivedError(view, errorCode, description, failingUrl); } @Override public WebResourceResponse shouldInterceptRequest(WebView view, String url) { WebResourceResponse response = super.shouldInterceptRequest(view, url); if (url != null && url.contains(INJECTION_TOKEN)) { String assetPath = url.substring(url.indexOf(INJECTION_TOKEN) + INJECTION_TOKEN.length(), url.length()); try { response = new WebResourceResponse( "application/javascript", "UTF8", webView.getContext().getAssets().open(assetPath) ); } catch (IOException e) { e.printStackTrace(); // Failed to load asset file } } return response; } }); } }); } // 注入js函数监听 private static void addImageClickListner(WebView webView) { // 这段js函数的功能就是,遍历所有的img几点,并添加onclick函数,在还是执行的时候调用本地接口传递url过去 webView.loadUrl("javascript:(function(){" + "var objs = document.getElementsByTagName(\"img\");" + "for(var i=0;i<objs.length;i++) " + "{" + "var img = objs[i]; " + "winWidth = window.innerWidth;" + "img.style.width = winWidth;" + "}" + "})()"); }