如何在Android库HtmlSpanner中添加HTML依赖（图片、CSS）并实现渲染？

我来帮你搞定HtmlSpanner加载本地资源的问题——你之前的尝试没成功，主要是没把资源路径、CSS注入和图片加载这几个环节打通，下面是一步步的解决方案：

1. 先把资源放在正确的位置 #

把你的index.html、CSS文件、图片文件夹全部放到Android项目的assets目录下（如果没有这个目录，就在main目录下新建一个）。比如目录结构可以是：

assets/
├─ index.html
├─ styles.css
└─ images/
   ├─ logo.png
   └─ banner.jpg

2. 读取本地HTML文件内容 #

HtmlSpanner的fromHtml方法需要传入HTML字符串，所以得先从assets里把index.html读出来：

AssetManager assetManager = getApplicationContext().getAssets();
String htmlContent = null;
try {
    InputStream inputStream = assetManager.open("index.html");
    byte[] buffer = new byte[inputStream.available()];
    inputStream.read(buffer);
    htmlContent = new String(buffer, StandardCharsets.UTF_8);
    inputStream.close();
} catch (IOException e) {
    e.printStackTrace();
}

3. 注入外部CSS文件 #

HtmlSpanner不会自动加载<link>标签引用的外部CSS，所以需要手动读取CSS内容并添加到HtmlSpanner实例中：

if (htmlContent != null) {
    HtmlSpanner htmlspanner = new HtmlSpanner();
    // 加载并添加CSS
    try {
        InputStream cssStream = assetManager.open("styles.css");
        String cssContent = new String(cssStream.readAllBytes(), StandardCharsets.UTF_8);
        cssStream.close();
        htmlspanner.addStyleSheet(cssContent);
    } catch (IOException e) {
        e.printStackTrace();
    }
    // 后续处理图片和渲染...
}

4. 自定义ImageHandler加载本地图片 #

这是你之前可能没做对的地方——默认的ImageHandler无法读取本地assets图片，必须重写getDrawable方法来加载：

htmlspanner.setImageHandler(new ImageHandler() {
    @Override
    public Drawable getDrawable(String src) {
        try {
            // src对应HTML中img标签的src属性，比如"images/logo.png"
            InputStream imgStream = assetManager.open(src);
            Drawable drawable = Drawable.createFromStream(imgStream, null);
            // 必须设置Drawable的边界，否则图片不会显示
            if (drawable != null) {
                drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
            }
            imgStream.close();
            return drawable;
        } catch (IOException e) {
            e.printStackTrace();
            // 加载失败时返回默认占位图或者null
            return super.getDrawable(src);
        }
    }
});

5. 最终渲染HTML #

完成上面的配置后，就可以调用fromHtml渲染了：

CharSequence cs = htmlspanner.fromHtml(htmlContent);
// 将渲染结果设置到TextView（或其他支持CharSequence的控件）
yourTextView.setText(cs);

关键注意事项 #

• 确保HTML里的资源路径是相对于assets目录的，比如<img src="images/logo.png">对应assets/images/logo.png
• 如果你的HTML里已经把CSS写在<style>标签内，就不需要手动注入外部CSS了
• 不要忘记设置Drawable的bounds，否则图片会无法显示

内容的提问来源于stack exchange，提问作者Herz.