文本颜色

语法:.fontColor(颜色值)

例如我们上期的代码:

Text('小说简介')
  .fontColor(Color.Orange)
  .fontColor('#df3c50)

 提示:

① 色值也能在其他写颜色的属性方法中使用,如:背景色

② 通常来说以Color.颜色名是我们做测试用的颜色,一般我们要用十六进制来用颜色

我们来做一个综合练习

思路:排版 → 内容 → 美化

build() {
    Column() {
      Text('怒斩14境大妖')
      .width('100%')
        .height(40)
      .fontSize(24)
      Row() {
        Text('置顶')
          .fontColor('#df3c50')
          .width(40)
        Text('陈平安')
          .fontColor('#a1a1a1')
          .width(55)
        Text('999评论')
          .fontColor('#a1a1a1')
      }
      .width('100%')
    }
    .width('100%')
  }

文本溢出省略号、行高

1.文字溢出省略(设置文本超长时的显示方式)

语法:

.textOverfolow({
    overflow: TextOverfolow.XXX
})

注意:需要配合 .maxLines(行数) 使用  控制最大行数

2.行高

语法:.lineHeight(数字)

我们来做一个综合练习

将以上的内容优化成下面图片的样子 

  

build() {
    Column() {
      Text('HarmonyOS开发初体验')
        .width('100%')
        .fontWeight(FontWeight.Bold) //文本加粗
        .lineHeight(50) //文本行高
        .fontSize(20) //文本大小
      Text('方舟开发框架(简称ArkUI)为HarmonyOS应用的UI开发提供了完整的基础设施,包括简介的UI语法、丰富的UI功能(组件、布局、动画以及交互事件),以及实时界面预览工具等,可以支持开发者进行可视化界面开发。')
        .width('100%')
        .lineHeight(24)
        // 重点记忆:文字溢出显示省略号
        .textOverflow({
          overflow:TextOverflow.Ellipsis
        })
      // 必须配合maxLines才有效果
        .maxLines(2)
    }
    .width('100%')
  }

Logo

讨论HarmonyOS开发技术,专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。

更多推荐