Android webview加载html片段,没有<html><head>标签

来源：互联网发布：xp保存网络密码编辑：程序博客网时间：2024/06/05 21:12

一开始我接触到html片段的时候就是只有<p><img>等等，就是没有<html><head>这些标签时，要怎么显示这个html代码片段呢？

下面就说说我接触的分析跟想法：

一、一开始我以为直接用TextView中的 Html.fromHtml(content)实现，这里的content就是后台传过来的html片段代码字符串。不过结果是<img>没有显示出来，感觉很丑，效果不是很理想。

二、在网上搜索"WebView加载HTML代码"这就出来了。

WebView提供的loadData(String data , String mimeType , String encoding)方法，该方法可用于加载并显示HTML代码，但在实际使用过程中，当它加载包含中文HTML内容时，WebView将会显示乱码。

WebView还提供了一个loadDataWithBaseURL(String baseUrl , String data , String mimeType , String encoding , String historyUrl)方法,该方法是loadData(String data , String mimeType , String encoding)方法的增强版，它不会产生乱码。
1、data：指定需要加载的HTML代码。
2、mimeType：指定HTML代码的MIME类型，对于HTML代码可指定为text/html。

3、encoding：指定HTML代码编码所用的字符集。比如指定为GBK。

采用这种第二中方法的思路是：在本地建一个.html文件，通过拼接<html><head>在把html代码片段加入到<body>中，然后通过上面的loadDataWithBaseURL加载出来。总共有3步：

1、本人用as 开发的,这里实在src->main->assets->中建一个text.html 内容可以为空

2、新建一个WebLoadHtmlUtils类，对html代码片段进行拼接用的

3、WebView mWebView = (WebView) findViewById(R.id.webview);
mWebView.loadDataWithBaseURL("file:///android_asset/", WebLoadHtmlUtils.loadHtml(item.getArticleTitle(), item.getArticleContent()), "text/html", "utf-8", null);

上面需要的WebLoadHtmlUtils类

public class WebLoadHtmlUtils {    public static String loadHtml(String title, String content) {        StringBuilder html = new StringBuilder();        html.append("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");        html.append("<html xmlns=\"http://www.w3.org/1999/xhtml\">");        html.append("<head>");        html.append("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />");        html.append("<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">");        html.append("<meta http-equiv=\"Cache-Control\" content=\"no-transform\">");        html.append("<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no\">");        html.append("<meta name=\"keywords\" content=\"\">");        html.append("<title>" + title + "</title>");        html.append("<style> img { width: 100%; }</style>");        html.append("</head>");        html.append("<body>" + content + "</body>");        html.append("</html>");        return html.toString();    }}

这里考虑到img要适应屏幕宽度所以给了width:100%;这里可能还有很多标签属性需要设置的，可以根据实际情况自己写上
参考：http://www.cnblogs.com/jiww/p/5643041.html

0 0