最近遇到个问题Android里面用webView加载含有base64格式图片的html,很多人可能可以直接加在使用下面这种方法，但是运行之后你会发现里面的base64格式图片显示不出来。
webview.loadData(Html.fromHtml(content).toString(), "text/html", "UTF-8");
看网上的说有的方法是把里面的base64格式的图片先转换成图片然后再存到服务器，然后再把base64替换下，这样虽然也可以实现但是我感觉很麻烦，并且我们的需求就是Android处理，服务器不改了，这是我看到的那个替换的方法有需要的可以看下(https://blog.csdn.net/shirley153/article/details/96978104)。
话不多说了，下面是我想到的方法以及实现，我的方法就是
1.创建一个web.html文件，并且创建一个有参数的方法供Android调用,就是很简单的那种
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<style>
html {
padding: 15px;
}
body {
word-wrap: break-word;
font-size: 13px;
padding: 0px;
margin: 0px
}
p {
padding: 0px;
margin: 0px;
font-size: 16px;
color: #222222;
line-height: 1.3;
}
img {
padding: 0px, margin:0px;
max-width: 100%;
width: auto;
height: auto;
}
</style>
</head>
<body>
<div id="content" style="width: 100%;height: 100%;">111</div>
</body>
<script charset="UTF-8">
function showWebView(param){
document.getElementById("content").innerHTML=param.content;
}
</script>
</html>
2.通过Android里面的webView调用html里面的有参方法，去加载。下面是Activity和布局
MainActivity
package com.qy.ndkdemo;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Context;
import android.content.res.AssetManager;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
public class MainActivity extends AppCompatActivity {
WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = findViewById(R.id.sample_text);
WebSettings websettings = webView.getSettings();
webView.loadUrl("file:///android_asset/web.html"); //得到web.html文件路径，并且加载
websettings.setJavaScriptEnabled(true);
webView.getSettings().setDefaultTextEncodingName("utf-8");
webView.getSettings().setJavaScriptEnabled(true);
//这里要注意调用js的方法一定要再页面加载完成后（onPageFinished里面）调用，不然会不成功
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
//webjson.json,真实项目中一般都是网络获取,现在就直接写在本地了
String jsonStr = getJson(MainActivity.this, "webjson.json");//获取assets目录下的json文件数据
String str = "javascript:showWebView(" + jsonStr + ")"; //调用js方法
webView.loadUrl(str);
}
});
}
//将json数据转换成字符串
public String getJson(Context context, String fileName) {
StringBuilder stringBuilder = new StringBuilder();
try {
AssetManager assetManager = context.getAssets();
BufferedReader bf = new BufferedReader(new InputStreamReader(
assetManager.open(fileName)));
String line;
while ((line = bf.readLine()) != null) {
stringBuilder.append(line);
}
} catch (IOException e) {
e.printStackTrace();
}
return stringBuilder.toString();
}
}
MainActivity 的布局文件,很简单就一个webView
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:id="@+id/sample_text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Hello World!"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
用到的webjson.json
{
"content": "<ul><li>这是简单的测试<img src=\"data:image/jpeg;base64,base64格式编码，自己替换吧，不然文章太长了\"></li></ul>"
}
web.html和webjson.json的存放目录
运行结果截图：
到这里就Ok了。
网友评论