HarmonyOS Text组件富文本解析问题

需要在text中插一个图片,所以用到了ImageSpan。现在Span这块的内容是需要富文本解析的,Text中不支持插入RichText,如何实现?

Text() {
  if (this.essences === "T") {
    ImageSpan($r('app.media.essences'))
      .width(16)
      .height(16)
      .margin({ right: 4 })
      .objectFit(ImageFit.Contain)
      .verticalAlign(ImageSpanAlignment.CENTER)
  }
  Span(this.text)
    .fontColor($r('app.color.txt_color'))
    .fontSize(15)
    .lineHeight(20)
    .fontWeight(400)
}
.layoutWeight(1)
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis })
HarmonyOS
2天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

需要借助个row组件包括,RichEditor需要放在text组件外面:

@Entry
@Component
struct Index {
  controller: RichEditorController = new RichEditorController();
  options: RichEditorOptions = { controller: this.controller };

  build() {
    Row() {
      Text() {
        ImageSpan($r('app.media.startIcon')).width("20%")
      }

      RichEditor(this.options)
        .onReady(() => {
          this.controller.addTextSpan("12345",
            {
              style:
              {
                fontColor: Color.Orange,
                fontSize: 50
              }
            })
        })
    }
    .width("100%")
  }
}

要么就要一起去解析:

// xxx.ets
@Entry
@Component
struct Index {
  controller: RichEditorController = new RichEditorController();
  option: RichEditorOptions = { controller: this.controller };

  build() {
    Column() {
      RichEditor(this.option)
        .onReady(() => {
          this.controller.addTextSpan("123456789",
            {
              style:
              {
                fontColor: Color.Blue,
                fontSize: 30
              }
            })
          this.controller.addImageSpan($r("app.media.startIcon"),
            {
              imageStyle:
              {
                size: ["100px", "100px"]
              }
            })
        })
    }
    .width("100%")
    .height("70%")
  }
}
分享
微博
QQ
微信
回复
2天前
相关问题
HarmonyOS 文本组件问题
588浏览 • 1回复 待解决
HarmonyOS 加载文本问题
215浏览 • 1回复 待解决
HarmonyOS 文本渲染问题
405浏览 • 1回复 待解决
HarmonyOS html文本显示问题
1319浏览 • 1回复 待解决
HarmonyOS Web组件加载文本异常
557浏览 • 1回复 待解决
Text怎么解析展示带html标签的文本
2315浏览 • 1回复 待解决
HarmonyOS 文本超出容器
533浏览 • 1回复 待解决
HarmonyOS 文本点击事件
730浏览 • 1回复 待解决
文本在web组件中无法展示
2240浏览 • 1回复 待解决
HarmonyOS Text组件中,文本怎么换行
166浏览 • 1回复 待解决
获取文本Text组件的宽度
711浏览 • 1回复 待解决
HarmonyOS 如何支持表情和文本
853浏览 • 2回复 待解决
HarmonyOS 关于实现TextView文本功能
199浏览 • 1回复 待解决
HarmonyOS TextInput是否支持文本
274浏览 • 1回复 待解决
HarmonyOS Text组件如何计算文本行数
180浏览 • 1回复 待解决
HarmonyOS 文本加载页面适配不兼容
189浏览 • 1回复 待解决
HarmonyOS web控件加载文本,字太小
723浏览 • 1回复 待解决