Jetpack Compose：无需replace方法，为<p>标签内容增加间距？

在Jetpack Compose的Text组件中展示数据库中包含HTML标签的内容时，使用AnnotatedString.fromHtml()加载带<p>标签的文本，段落之间仅显示单个空格，无法形成合适的段落分隔。示例代码如下：

val lipsum="<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>"
Text(AnnotatedString.fromHtml(lipsum))

当前通过自定义字符串替换方法移除<p>并将</p>替换为\n\n来实现段落分隔，但想了解是否存在无需使用replace方法的替代方案：

fun String.marksAndHtml(): String {
    return this
        .replace("_", NBSP_SALMOS)
        .replace("§", BRS)
        .replace("~", BR)
        .replace("¦", NBSP_4)
        .replace("⊣", BR + NBSP_4)
        .replace("≀", BR + NBSP_4 + NBSP_4)
        .replace("~", BR)
        .replace("§", BRS)
        .replace("∸", BRS)
        .replace("</p>", BRS, true)
        .replace("<p>", "", true)
}

Text(AnnotatedString.fromHtml(lipsum.marksAndHtml()))

有三种无需直接使用replace方法的方案可以实现段落间距：

1. 用AndroidView嵌入原生TextView #

原生Android的TextView对HTML的<p>标签有原生支持，会自动为段落添加间距，还能通过原生API调整间距大小。直接用Compose的AndroidView包裹原生TextView即可：

AndroidView(factory = { context ->
    TextView(context).apply {
        text = Html.fromHtml(lipsum, Html.FROM_HTML_MODE_COMPACT)
        // 自定义文本样式
        setTextColor(ContextCompat.getColor(context, R.color.default_text))
        textSize = 16f
        // 设置段落额外间距，第一个参数是额外行间距，第二个是行高倍数
        setLineSpacing(8.dp.toPx(), 1.2f)
    }
})

2. 自定义HTML解析器处理段落标签 #

利用Compose的HtmlParser（来自androidx.compose.ui.text.platform包），通过监听<p>标签的结束事件，为段落添加特定格式：

val htmlConverter = HtmlToAnnotatedStringConverter(
    paragraphStyle = object : HtmlParser.ParagraphStyle {
        override fun handleTagStart(tag: String, attributes: Map<String, String>): ParagraphStyle? = null

        override fun handleTagEnd(tag: String): ParagraphStyle? {
            return if (tag.equals("p", ignoreCase = true)) {
                // 通过ParagraphStyle定义段落的行高样式，间接实现段落间距
                ParagraphStyle(
                    lineHeightStyle = LineHeightStyle(
                        alignment = LineHeightStyle.Alignment.CENTER,
                        trim = LineHeightStyle.Trim.None
                    )
                )
            } else {
                null
            }
        }
    }
)

val annotatedContent = htmlConverter.convert(lipsum)
Text(annotatedContent, lineHeight = 22.sp)

如果需要更精准的段落间距，还可以在解析每个<p>内容后，手动向AnnotatedString中插入\n\n（这是解析阶段处理，而非字符串替换）。

3. 使用HTML解析库提取段落内容 #

借助Jsoup这类HTML解析库，直接提取所有<p>标签的文本内容，再构建带有段落分隔的AnnotatedString：

// 先添加Jsoup依赖：implementation "org.jsoup:jsoup:1.17.2"
val doc = Jsoup.parse(lipsum)
val paragraphs = doc.select("p").map { it.text() }

val annotatedString = buildAnnotatedString {
    paragraphs.forEachIndexed { index, content ->
        append(content)
        // 最后一段不添加换行
        if (index != paragraphs.lastIndex) {
            append("\n\n")
        }
    }
}

Text(annotatedString, lineHeight = 20.sp)

这种方式通过解析HTML结构获取段落，而非字符串替换，能避免误替换其他标签内容的问题，同时更灵活地控制段落格式。

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