【HarmonyOS】对动态文本中的字体颜色调整

一、需求说明

对整体段落中的部分文字的颜色进行调整,如下图:

二、需求分析

该段文字展示时为一个整体段落,可以使用Text组件嵌套Span组件进行实现。

Span 只能作为 TextRichEditor 组件的子组件显示文本内容。可以在一个Text内添加多个Span来显示一段信息,例如产品说明书、承诺书等。

Span组件需要写到Text组件内,单独写Span组件不会显示信息,Text与Span同时配置文本内容时,Span内容覆盖Text内容。

三、解决办法

html 复制代码
Column() {
  Text() {
    Span(`您已经成功完成报名。请在 `)
      .fontSize(14)
      .fontColor('#616366')
    Span(`开始时间 - 结束时间(具体时间由各市根据实际情况安排)`)
      .fontSize(14)
      .fontColor('#fd7e2b')
    Span(`前往现场审查,否则视为放弃考试报名。`)
      .fontSize(14)
      .fontColor('#616366')
  }
  .lineHeight(20)
}
.width('100%')
.padding(12)
.backgroundColor('#FFF')

四、参考链接

参考1:

【HarmonyOS NEXT】一段动态文本,动态长度,如何改变这段文本中某几个字的颜色_鸿蒙next 文字匹配变色-CSDN博客

参考2:

文本显示 (Text/Span)-添加常用组件-添加组件-UI开发 (ArkTS声明式开发范式)-ArkUI(方舟UI框架)-应用框架 - 华为HarmonyOS开发者 (huawei.com)

相关推荐
别说我什么都不会16 小时前
OpenHarmony 5.0(API 12)关系型数据库relationalStore 新增本地数据变化监听接口介绍
api·harmonyos
MardaWang16 小时前
HarmonyOS 5.0.4(16) 版本正式发布,支持wearable类型的设备!
华为·harmonyos
余多多_zZ16 小时前
鸿蒙学习手册(HarmonyOSNext_API16)_应用开发UI设计:Swiper
学习·ui·华为·harmonyos·鸿蒙系统
斯~内克16 小时前
鸿蒙网络通信全解析:从网络状态订阅到高效请求实践
网络·php·harmonyos
别说我什么都不会17 小时前
OpenHarmony 5.0Release 开发的在线音乐应用卡片
app·harmonyos
威哥爱编程20 小时前
在HarmonyOS NEXT 开发中,如何指定一个号码,拉起系统拨号页面
华为·harmonyos·arkts
The 旺20 小时前
《HarmonyOS Next开发进阶:打造功能完备的Todo应用华章》
华为·harmonyos
鸿蒙布道师1 天前
鸿蒙NEXT开发随机工具类(ArkTs)
android·ios·华为·harmonyos·arkts·鸿蒙系统·huawei