⚡
原生渲染，轻量高效
纯 ArkUI 原生组件渲染，不依赖 WebView，解析与渲染模型只在 html 变化时构建一次，普通文章无压力。
HtmlRichText鸿蒙 NEXT 富文本解析组件
不依赖 WebView 与系统 RichText 的自研 HTML 富文本组件。手写 HTML 解析器 + ArkUI 原生渲染（Text / Span / Image / Flex / Grid），样式完全可控，专为资讯 / 文章详情页设计。
Skip to content
1.0+当前版本
API 12+支持版本
53逻辑层单测断言
Apache-2.0开源协议
WHY SELF-DEVELOPED
为什么选择自研解析
不依赖 WebView 与系统 RichText，专为资讯 / 文章详情页设计
Web 组件
- 组件重、加载慢
- 交互不原生、与页面主题割裂
- 内存与性能开销大
- 需要 WebView 运行环境
系统 RichText
- 样式控制弱（行高/间距/字体）
- 图片无法自定义加载与点击预览
- pre/code 等标签支持不全
- 事件支持有限
HtmlRichText 推荐
- 纯 ArkUI 原生渲染，轻量高效
- 每个标签的样式都可定制
- 图片可点击全屏预览
- 代码块支持高亮与横向滚动
- 手写解析器，容错性强
QUICK START
一行引入，即刻渲染
ohpm 安装后，像使用普通组件一样使用 HtmlRichText
ArticlePage.ets
import { HtmlRichText, RichTextConfig } from 'htmlrichtext'
@Entry
@Component
struct ArticlePage {
@State html: string = '<h2>标题</h2><p>正文<strong>加粗</strong></p>'
private config: RichTextConfig = new RichTextConfig()
build() {
Scroll() {
Column() {
HtmlRichText({
html: this.html,
config: this.config,
onLinkClick: (url: string) => { this.openUrl(url) }
})
}
}
}
}TAG SUPPORT
全面标签支持
标题、列表、表格、代码块、引用，常见 HTML 标签开箱即用