鸿蒙Text组件的用法(附带实例)
Text 组件用于显示一段文本,可以包含 Span 等子组件。
下表罗列了 Text 组件的属性:
Text 组件的示例代码如下:
Text 组件的示例效果如下图所示:

图 1 Text组件的示例效果
下表罗列了 Text 组件的属性:
属性名称 | 属性描述 |
---|---|
textAlign | 设置文本段落在水平方向的对齐方式。 |
textOverflow | 设置文本超长时的显示方式。默认值为 {overflow: TextOverflow.Clip}。 |
maxLines | 设置文本的最大行数。 |
lineHeight | 设置文本的行高。设置值不大于 0 时,不限制文本行高,自适应字体大小。 |
decoration | 设置文本装饰线样式及其颜色。 |
baselineOffset | 设置文本基线的偏移量,默认值为 0。 |
letterSpacing | 设置文本字符间距。 |
minFontSize | 设置文本最小显示字号。 |
maxFontSize | 设置文本最大显示字号。 |
textCase | 设置字母的大小写。 |
copyOption | 组件支持设置文本是否可复制粘贴。 |
draggable | 设置选中文本的拖曳效果。 |
wordBreak | 设置断行规则。 |
Text 组件的示例代码如下:
Column(){ Text("君不见,黄河之水天上来,奔流到海不复回, Don't you see, the water of the Yellow River comes from the sky and flows to the sea without coming back ") .textAlign(TextAlign.Center) /* * TextAlign.Start // 水平对齐首部 * TextAlign.Center // 水平居中对齐 * TextAlign.End // 水平对齐尾部 * TextAlign.JUSTIFY // 双端对齐 */ .textOverflow({ overflow:TextOverflow.Ellipsis }) /* * overflow:TextOverflow.None // 文本超长时,按最大行截断显示。此时采用默认属性 * overflow:TextOverflow.Clip // 文本超长时,按最大行截断显示 * overflow:TextOverflow.Ellipsis // 文本超长时,显示不长的文本用省略号代替 * overflow:TextOverflow.MARQUEE // 文本超长时,以跑马灯的方式显示 */ .maxLines(2) // 设置文本的最大行数 .lineHeight(35) // 设置文本的行高 .decoration({ type:TextDecorationType.Underline, color:Color.Green }) /* * type: 样式 * TextDecorationType.Underline // 文字用下画线修饰 * TextDecorationType.LineThrough // 穿过文本的修饰线 * TextDecorationType.Overline // 文字用上画线修饰 * TextDecorationType.None // 不使用文本装饰线 */ .letterSpacing(5) // 设置文本字符间距 .textCase(TextCase.UpperCase) // 设置字母大小写 /* * 设置字母大小写 * TextCase.Normal // 保持字母原有大小写 * TextCase.LowerCase // 字母采用全小写 * TextCase.UpperCase // 字母采用全大写 */ .copyOption( CopyOptions.InApp ) /* * 组件支持设置文本是否可复制粘贴 * CopyOptions.None // 不支持复制 * CopyOptions.InApp // 支持应用内复制 * CopyOptions.LocalDevice // 支持设备内复制 * CopyOptions.CROSS_DEVICE // 支持跨设备复制 */ .draggable(true) // 设置选中文本的拖曳效果 .fontSize(30) // 设置字体大小 }
Text 组件的示例效果如下图所示:

图 1 Text组件的示例效果