Android应用FAQ展开视图开发：JSON存储HTML能否在HTML View正常渲染？

刚好你是要做FAQ的展开式视图，这个方案完全可行，我来给你详细讲怎么做：

1. JSON存储HTML的正确姿势 #

JSON本身就是字符串格式的容器，直接把HTML代码作为JSON字段的value就行，但要注意转义特殊字符，比如双引号、反斜杠这些，不然JSON解析器会报错。

举个适配你需求的JSON示例（带图片对齐的列表答案）：

{
  "faqList": [
    {
      "question": "如何配置展开式视图的对齐列表？",
      "answer": "<ul><li><img src='file:///android_asset/check_icon.png' align='left' style='margin-right:8px;' /> 先在JSON中定义好带HTML标签的答案内容</li><li><img src='file:///android_asset/check_icon.png' align='left' style='margin-right:8px;' /> 在Android端读取后用HTML View渲染</li></ul>"
    }
  ]
}

如果你的HTML里包含双引号（比如属性值），记得转成\"，比如<img src=\"check_icon.png\" ...>。

2. Android端两种渲染方式的实现 #

方式一：用TextView（轻量但支持标签有限） #

TextView可以通过Html.fromHtml()方法渲染简单HTML，但注意Android版本差异：

• Android N及以上：用Html.fromHtml(htmlString, Html.FROM_HTML_MODE_COMPACT)
• 低于Android N：直接用Html.fromHtml(htmlString)

另外，要渲染<img>标签的话，需要自定义ImageGetter来加载本地图片，示例代码：

// 假设answerHtml是从JSON中读取的HTML字符串
Html.ImageGetter imageGetter = new Html.ImageGetter() {
    @Override
    public Drawable getDrawable(String source) {
        // 从drawable中加载图片，source可以是你定义的标识（比如"check_icon"）
        Drawable drawable = getResources().getDrawable(R.drawable.check_icon);
        drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
        return drawable;
    }
};

// Android N+版本的渲染
CharSequence styledAnswer = Html.fromHtml(answerHtml, Html.FROM_HTML_MODE_COMPACT, imageGetter, null);
yourAnswerTextView.setText(styledAnswer);

TextView支持的HTML标签有限，比如<ul>、<li>、<b>、<i>这些基本标签，复杂布局建议用WebView。

方式二：用WebView（灵活支持更多HTML特性） #

WebView能支持更复杂的HTML和CSS，适配你需要的图片对齐、列表样式需求，实现也简单：

WebView answerWebView = findViewById(R.id.answer_webview);
// 加载HTML字符串，指定编码和类型
answerWebView.loadDataWithBaseURL(null, answerHtml, "text/html", "UTF-8", null);

// 如果要加载assets里的图片，HTML里的src写成file:///android_asset/xxx.png

你还可以在HTML里加入CSS来优化样式，比如让图片和文本对齐更精准：

<li style="list-style: none; padding-left: 32px; position: relative; margin: 8px 0;">
  <img style="position: absolute; left: 0; top: 2px; width:24px; height:24px;" src="file:///android_asset/check_icon.png" />
  这里是列表项的文本内容
</li>

3. 针对FAQ展开式视图的小建议 #

• 把图片资源统一放在assets或者drawable目录，避免网络加载的延迟和失败问题；
• 如果用WebView，可以提前设置好基础样式（比如字体大小、行间距），让所有FAQ的答案风格统一；
• 解析JSON时要捕获异常，避免因为HTML格式错误导致崩溃；
• 展开/收起视图时，记得动态调整TextView或WebView的高度，避免内容被截断。

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