WebView加载html代码并附加css,js

柔情只为你懂 2022-06-05 06:47 286阅读 0赞

# WebView踩坑 #

## 1.WebView的配置 ##

WebSettings settings = wvDetailContent.getSettings();
    if (mPresenter.getNoImageState()) {
        //设置为无图模式
        settings.setBlockNetworkImage(true);
    }
    
    //判断用户是否设置了自动缓存
    if (mPresenter.getAutoCacheState()) {
        //设置是否应该启用应用程序缓存API。 默认值是false
        settings.setAppCacheEnabled(true);
        //设置是否启用DOM存储API。 默认值是false。
        settings.setDomStorageEnabled(true);
        //设置是否启用数据库存储API。 默认值是false。
        settings.setDatabaseEnabled(true);
        if (SystemUtil.isNetworkConnected()) {
            //默认缓存使用模式。
            settings.setCacheMode(WebSettings.LOAD_DEFAULT);
        } else {
            //不要使用网络，从缓存中加载。
            settings.setCacheMode(WebSettings.LOAD_CACHE_ONLY);
        }
    }
    
    //是否启用JS
    settings.setJavaScriptEnabled(true);
    //设置自适应屏幕 缩小宽度以适合屏幕的内容
    settings.setLoadWithOverviewMode(true);
    //设置布局算法,将所有内容移动到视图宽度的一列中。
    settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
    //设置是否允许进行缩放
    settings.setSupportZoom(true);

## 2.在html中引入外部css,js文件 常规拼接顺序css->html->js ##

/** * @author xfhy * @create at 2017/11/11 20:22 * description：html工具类,方便显示 * 在html中引入外部css,js文件 常规拼接顺序css->html->js */
    object HtmlUtil { 
        //css样式,隐藏header
        private const val HIDE_HEADER_STYLE = "<style>div.headline{display:none;}</style>"
        //css style tag,需要格式化
        private const val NEEDED_FORMAT_CSS_TAG = "<link rel=\"stylesheet\" type=\"text/css\" href=\"%s\"/>"
        // js script tag,需要格式化
        private const val NEEDED_FORMAT_JS_TAG = "<script src=\"%s\"></script>"
        const val MIME_TYPE = "text/html; charset=utf-8"
        const val ENCODING = "utf-8"
    
        /** * 根据css链接生成Link标签 * * @param url String * @return String */
        fun createCssTag(url: String): String {
            return String.format(NEEDED_FORMAT_CSS_TAG, url)
        }
    
        fun createCssTag(urls: List<String>): String {
            val sb = StringBuffer()
            for (url in urls) {
                sb.append(createCssTag(url))
            }
            return sb.toString()
        }
    
        fun createJsTag(url: String): String {
            return String.format(NEEDED_FORMAT_JS_TAG, url)
        }
    
        fun createJsTag(urls: List<String>): String {
            val sb = StringBuilder()
            for (url in urls) {
                sb.append(createJsTag(url))
            }
            return sb.toString()
        }
    
        fun createHtmlData(html: String, cssList: List<String>, jsList: List<String>): String {
            val css = createCssTag(cssList)
            val js = createJsTag(jsList)
            return "$css$HIDE_HEADER_STYLE$html$js"
        }
    
    }

## 3.开始加载 ##

String htmlData = HtmlUtil.createHtmlData(zhihuDetailBean.getBody(),zhihuDetailBean.getCss(),zhihuDetailBean.getJs());
    wvDetailContent.loadData(htmlData, HtmlUtil.MIME_TYPE, HtmlUtil.ENCODING);

## 4.回退处理 ##

public boolean onKeyDown(int keyCode, KeyEvent event) {
            if ((keyCode == KeyEvent.KEYCODE_BACK) && wvDetailContent.canGoBack()) {
                wvDetailContent.goBack();
                return true;
            }
            return super.onKeyDown(keyCode, event);
        }