鸿蒙组件学习_Text组件

说明

Text组件从API Version 7开始支持。

子组件

可以包含Span子组件

代码测试

复制代码
Text(){
    Span('hello World')
      .decoration({
        type: TextDecorationType.Underline,
        color: Color.Black
      })
      .letterSpacing(5)
      .textCase(TextCase.Normal)
}

span属性:
decoration
    type:   字体
        TextDecorationType.Underline    下划线    
        TextDecorationType.LineThrough  贯穿线
        TextDecorationType.Overline     上划线
    color:  颜色
letterSpacing:  string | number
textCase:   设置文本大小写
    TextCase.Normal     文本正常显示
    TextCase.LowerCase  小写
    TextCase.UpperCase  大写

Text参数
    content     文本内容。包含子组件Span时不生效,显示Span内容,并且此时text组件的样式不生效。
Text属性
    textAlign   设置文本段落在水平方向的对齐方式
    textOverflow    设置文本超长时的显示方式
    maxLines    设置文本的最大行数
    lineHeight  设置文本的文本行高,设置值不大于0时,不限制文本行高,自适应字体大小,Length为number类型时的单位为fp
    decoration  设置文本装饰线样式及其颜色
    letterSpacing   设置文本字符间距
    baselineOffset  设置文本基线的偏移量,默认值0
    minFontSize 设置文本最小显示字号
    maxFontSize 设置文本最大显示字号
    textCase    设置文本大小写
    copyOption  组件支持设置文本是否可复制粘贴
相关推荐
奔跑的露西ly6 小时前
【HarmonyOS NEXT】ArkUI实现「单格单字符+下划线」手机号/验证码输入框
ui·华为·harmonyos·鸿蒙
小白阿龙9 小时前
鸿蒙+flutter 跨平台开发——图像编解码与水印嵌入技术实战
flutter·华为·harmonyos·鸿蒙
小白阿龙11 小时前
鸿蒙+flutter 跨平台开发——基于日历视图的生理周期计算逻辑
flutter·华为·harmonyos·鸿蒙
lbb 小魔仙16 小时前
【Harmonyos】开源鸿蒙跨平台训练营DAY1:Windows上搭建Flutte跨平台开发环境
windows·flutter·harmonyos·鸿蒙·开源鸿蒙·鸿蒙开平台应用
熊猫钓鱼>_>16 小时前
【开源鸿蒙跨平台开发先锋训练营】DAY 2 React Native for OpenHarmony 开发笔记与实战指南
react native·开源·harmonyos·arkts·openharmony·gitcode·atomgit
世人万千丶17 小时前
鸿蒙跨端框架 Flutter 学习 iverpod 实战:超越 Provider 的响应式状态管理
学习·flutter·华为·交互·harmonyos·鸿蒙
小白阿龙17 小时前
鸿蒙+flutter 跨平台开发——自定义单词速记APP开发实战
flutter·华为·harmonyos·鸿蒙
世人万千丶18 小时前
鸿蒙跨端框架 Flutter 学习:GetX 全家桶:从状态管理到路由导航的极简艺术
学习·flutter·ui·华为·harmonyos·鸿蒙
小白阿龙19 小时前
鸿蒙+flutter 跨平台开发——从零打造手持弹幕App实战
flutter·华为·harmonyos·鸿蒙
小学生波波1 天前
最新版鸿蒙开发工具DevEco Studio保姆级安装教程
arkts·鸿蒙系统·安装教程·deveco studio·鸿蒙开发·harmonyos6