HarmonyOS鸿蒙Next中图文混排时Image组件交互事件无响应如何解决

【问题现象】

使用Text组件的StyledString/MutableStyledString实现图文混排富文本展示功能，预计实现url链接点击跳转能力，图片点击放大能力，以及文本样式展示能力，但在实现过程中发现，当设置StyledString/MutableStyledString的value值ImageAttachment或CustomSpan时，styles参数不生效。

点击URL文本打印日志：

I     点击URL文本响应交互事件

【背景知识】

• 属性字符串（StyledString/MutableStyledString）：是功能强大的标记对象，可用于字符或段落级别设置文本样式。通过将StyledString附加到文本组件， 可以通过多种方式更改文本，包括修改字号、添加字体颜色、使文本可点击以及自定义方式绘制文本等。
• ImageAttachment：用来在属性字符串中添加图片时使用的图片对象。
• ImageSpan:Text、ContainerSpan组件的子组件，用于显示行内图片。

【定位思路】

• 确认ImageAttachment对象参数类型中不支持直接绑定GestureStyle（手势响应操作）。
• StyleOptions绑定GestureStyle时需要提供start和length数据，即说明手势触发区域，但图片对象无法给出明确的开始位置和长度，通过设置length=1验证，无法成功明确手势响应区域。
• 查找文本+图片混排的其他方案，找到一个行内图片展示组件ImageSpan，通用事件中仅支持点击事件。

【解决方案】

核心代码：

Row()
  Text() {
    Span('https://www.baidu.com')
      .fontSize(18)
      .fontColor(Color.Blue)
      .onClick(() => {
        console.info(`点击URL文本响应交互事件`)
      })
    ImageSpan($r('app.media.startIcon'))
      .width(50)
      .height(50)
      .objectFit(ImageFit.Fill)
      .verticalAlign(ImageSpanAlignment.BOTTOM)
      .onClick(() => {
        console.info('点击图片响应交互事件')
      })
    Span('这是测试后半段')
      .fontSize(24)
      .fontColor(Color.Black)
  }

点击URL文本和图片日志打印：

com.examp..lication  I     点击URL文本响应交互事件
com.examp..lication  I     点击图片响应交互事件