一、组件简介

RichText 是 ArkUI 提供的富文本组件，用于解析并显示 HTML 格式的字符串。适合展示公告、协议说明、活动规则等静态或半静态的富文本内容。
注意：它只是"展示"组件，不支持用户编辑。需要图文混排编辑时请使用 RichEditor。

二、接口定义

接口：RichText(content: string)

• content：符合 HTML 语法的字符串。
• 字符串中可以包含 HTML 标签（如 <font>、<br>、<b> 等）来设置局部样式。

三、支持的属性

RichText 仅支持通用属性中的一部分，常见的有：

关键点：RichText 不会自适应内容高度，必须显式设置宽高，否则内容可能显示不全或溢出。

四、文本样式如何设置

组件本身没有 fontSize、fontColor 等文本属性，颜色、大小等样式需要通过 HTML 标签内嵌，例如：

• <font color="#FF0000" size="5">：设置颜色与字号
• <b> / <i> / <u>：加粗 / 斜体 / 下划线
• <br>：换行

五、简单示例

示例 1：系统欢迎公告

@Entry
@Component
struct WelcomeNotice {
  build() {
    Column({ space: 12 }) {
      Text('今日公告').fontSize(20).fontWeight(FontWeight.Bold)

      RichText(
        '<font color="#007DFF" size="5">系统升级通知</font><br>' +
        '<font color="#333333">今晚 22:00 - 24:00 进行停机维护，</font>' +
        '<b>请提前保存好工作内容</b>，<font color="#FF5500">给您带来不便敬请谅解。</font>'
      )
        .width('100%')
        .height(120)
        .padding(12)
        .backgroundColor('#F5F5F5')
        .borderRadius(8)
    }
    .width('100%')
    .padding(16)
  }
}

示例 2：使用 size 属性显示温馨提示

@Entry
@Component
struct WarmTip {
  build() {
    Column({ space: 10 }) {
      RichText(
        '<b>温馨提示：</b><br>' +
        '<font color="#888888">1. 请勿在公共网络下输入账号密码。</font><br>' +
        '<font color="#888888">2. 定期修改登录密码，提高账号安全性。</font><br>' +
        '<font color="#FF0000">3. 如遇异常登录，请立即联系管理员。</font>'
      )
        .size({ width: '90%', height: 160 })
        .backgroundColor('#FFF9E6')
        .borderRadius(6)
    }
    .width('100%')
    .padding(16)
  }
}

六、使用注意事项

1. 必须设置宽高：组件不自适应，超出部分会被裁剪。
2. 不支持子组件：不能在 RichText 内嵌套 Button、Image 等 ArkUI 组件。
3. 不支持事件绑定：onClick 等事件无法直接作用于 RichText 根节点。
4. 性能开销：底层复用 Web 渲染能力，内存占用较高；避免在 List 等高频滚动容器中大量使用，以免卡顿。
5. 深浅色适配：RichText 不自动适配系统深浅色，需根据 colorMode 动态拼接 HTML 颜色。
6. 安全限制：不支持执行脚本、加载远程资源、跳转链接等 Web 行为，仅做静态 HTML 渲染。

七、替代方案