HarmonyOS鸿蒙开发，Text组件作为容器使用（ImageSpan/Span）快速掌握

Text作为容器使用的时候，里面可以使用ImageSpan存放图片，Span用来存放文字

例如：（提供给我们更多关于文本和图片联动的解决方案）

编辑

示例代码：

@Entry@ComponentstructLianxi{@Statemessage:string='Hello World';build() {Column(){Text(){Span('简单示例')ImageSpan($r('app.media.startIcon')) } } }}

ImageSpan-快速掌握

1. ImageSpan跟Image差不多一样，不同的是Image不能放到Text（）{}里面使用，且关于矢量图ImageSpan不能使用例如

.fillColor(Color.White)

来修改矢量图的颜色，

2. 图片会根据文本的字体大小、行高进行适配

3. 用于在文本中嵌入图片，使图片与文本集成显示，适用于需要在文本段落中插入小图标等场景

Span-快速掌握

1. 可以像text组件一样使用。

注意管理图片的命名规范：当图片放入鸿蒙模拟器的目录中的时候，命名只能有字母，数字，_，且只有字母和_下划线可以作为开头，否则就会报错。

SymbolSpan-介绍

1. 不支持通用属性，支持以下属性fontColor，fontSize，fontWeight，等等

2.effectStrategy设置动效策略，如SymbolEffectStrategy.NONE（无动效）等，默认值为SymbolEffectStrategy.NONE

3.attributeModifier从 API version 12 起支持，可动态设置组件属性，需传入AttributeModifier<SymbolSpanAttribute>类型参数

ContainerSpan-介绍

1. 鸿蒙应用开发中,ArkTS的ContainerSpan是一个重要的组件用来统一管理多个Span、ImageSpan的背景色及圆角弧度

2. 不支持通用事件，

最后编辑于：2025.03.16 22:34:03

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。