Android 使用WebView加载大图片

Android 中ImageView加载超长图片会报一个警告，并且无法在ImageView上渲染图片。

OpenGLRenderer: Bitmap too large to be uploaded into a texture (440x13323, max=4096x4096)

据查，开启了硬件加速后，OpenGLRenderer能够加载Bitmap的具有限制最大值。
eg：当前的最大限制是 4096x4096
这个限制的最大值可以根据方法获得：

canvas.getMaximumBitmapHeight()和canvas.getMaximumBitmapWidth()

当ImageView无法渲染这些图片的时候，我们可以使用WebView来显示这张图片

我们需要借助一个库 jsoup，一个Java 的HTML解析器
下面来说具体的实现。

1、在assets下新建一个html文件，名为largeimg.xml

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml;charset=utf-8"/>

</head>
<body>


</body>

</html>

2、利用jsoup中的Document类，进行html的解析，获取到html的字符串。

  BufferedReader reader = null;
        try {
            reader = new BufferedReader(new InputStreamReader(getAssets().open(
                    "largeimg.html"), "UTF-8"));
            String mLine = reader.readLine();
            while (mLine != null) {
                mHtml += mLine;
                mLine = reader.readLine();
            }
            Log.e("TAG", "mHtml >> " + mHtml);
            doc = Jsoup.parse(mHtml);
        } catch (IOException e) {
        } finally {
            if (reader != null) {
                try {
                    reader.close();
                } catch (IOException e) {
                    // log the exception
                }
            }
        }

3、设置webview，构建html代码

        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setSupportZoom(true);
        settings.setBuiltInZoomControls(false);
        settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NARROW_COLUMNS);
        readNativeTemplateFile();//第二步骤中的代码
        Elements body = doc.select("body");
        webView.addJavascriptInterface(new JsObject(), "injectObject");//第4步骤
        body.html("<div><img width=\"100%\" height=\"auto\" src=\"" + imgUrl + "\" onclick='javascript:injectObject.close();' />"
                + "</div>");
        webView.loadDataWithBaseURL(
                "file:///android_asset/", doc.html(),
                "text/html", "UTF-8", "");

4、addJavascriptInterface

  class JsObject {
        JsObject() {
        }

        public String toString() {
            return "injectedObject";
        }

        @JavascriptInterface
        public void close() {
            finish();//finish掉当前的activity
        }
    }

至此，webview就可以显示一张图片了。

附：jsoup下载地址 https://jsoup.org/download

PS:可以通过关闭硬件加速的方法直接加载大图片
在AndroidManifest.xml中设置<application>的属性

android:hardwareAccelerated="false"

这样也可以直接加载大图

Android 使用WebView加载大图片

推荐阅读更多精彩内容