鸿蒙组件学习_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  组件支持设置文本是否可复制粘贴
相关推荐
kirk_wang13 小时前
Flutter 三方库鸿蒙适配实践:以 Firebase Messaging 为例实现跨平台推送集成
flutter·移动开发·跨平台·arkts·鸿蒙
kirk_wang17 小时前
Flutter SharedPreferences 鸿蒙端适配实践:原理、实现与优化
flutter·移动开发·跨平台·arkts·鸿蒙
kirk_wang20 小时前
鸿蒙UI组件与Flutter Widget混合开发:原理、实践与踩坑指南
flutter·移动开发·跨平台·arkts·鸿蒙
汉堡黄•᷄ࡇ•᷅1 天前
鸿蒙开发:案例集合List:ListItem拖拽(交换位置,过渡动画)
harmonyos·鸿蒙·鸿蒙系统
kirk_wang1 天前
当Flutter遇见纯血鸿蒙:SQLite兼容适配的实战与思考
flutter·移动开发·跨平台·arkts·鸿蒙
后端小张1 天前
【鸿蒙2025领航者闯关】鸿蒙OS在工业控制领域的技术突破与实战应用
5g·华为·云计算·harmonyos·鸿蒙·鸿蒙系统·鸿蒙2025领航者闯关
kirk_wang2 天前
Flutter三方库鸿蒙适配深度解析:从架构原理到性能优化实践
flutter·移动开发·跨平台·arkts·鸿蒙
汉堡黄•᷄ࡇ•᷅2 天前
鸿蒙开发: 案例集合List:ListItem侧滑(删除、收藏)
harmonyos·鸿蒙·鸿蒙系统
后端小张2 天前
【鸿蒙2025领航者闯关】鸿蒙生态共建:智慧医疗领域的分布式革新与实践
分布式·华为·harmonyos·鸿蒙·鸿蒙系统·鸿蒙2025领航者闯关·开发者年度总结
kirk_wang2 天前
鸿蒙分布式能力与Flutter集成:Flutter三方库鸿蒙适配实践
flutter·移动开发·跨平台·arkts·鸿蒙