作者：码上变富

团队：坚果派 公众号：“大前端之旅” 润开鸿生态技术专家，华为HDE，CSDN博客专家，CSDN超级个别，CSDN特邀嘉宾，InfoQ签约作者，OpenHarmony布道师，电子发烧友专家博客，51CTO博客专家，擅长HarmonyOS/OpenHarmony运用开发、熟悉服务卡片开发。欢迎协作。

前语

凡天下事，预则立，不预则废。 关于鸿蒙开发学与不学的争辩，在网上铺天盖地，争辩得不亦乐乎。笔者以为，鸿蒙作为一个优秀的国产系统，咱们应该理性考虑，与其在犹豫中徘徊，不如先静下心来一步一步学起来，剩下的交给时刻，撸起袖子，干就完了！

手把手一步一步学鸿蒙（一）

  1. 第一篇 小试牛刀：Text组件的运用

咱们从官网developer.harmonyos.com/cn/develop/… 下载开发工具，安装好之后翻开工具

手把手一步一步学鸿蒙（一）

手把手一步一步学鸿蒙（一）

手把手一步一步学鸿蒙（一）

此时咱们就创立一个鸿蒙项目，很简单吧

咱们index文件中的message稍作修正，然后保存（ctrl S）

@State message: string = '手把手一步一步学鸿蒙'

咱们会看到开发工具的预览器上发生了一点小改变

手把手一步一步学鸿蒙（一）

这便是咱们写的第一行鸿蒙代码。 接着咱们想让字显现在一行，咱们能够修正字体的大小，咱们只需要修正fontSize特点

Column() {
  Text(this.message)
    .fontSize(30)
    .fontWeight(FontWeight.Bold)
}

假如咱们想修正字的色彩，咱们只需要修正fontColor特点

Column() {
  Text(this.message)
    .fontSize(30)//字体大小
    .fontWeight(FontWeight.Bold)//字体粗细
    .fontColor(Color.Blue)//字体色彩
}

咱们给Text加上width特点

手把手一步一步学鸿蒙（一）

咱们发现文字向左紧靠着屏幕边际了，这是为什么呢？

手把手一步一步学鸿蒙（一）

咱们点击TT按钮，鼠标放在“手把手一步一步学鸿蒙”这几个字上

手把手一步一步学鸿蒙（一）
能够发现这几个字所在的组件Text宽度和屏幕宽度相同大了，而且里面的字默许是向左对齐的。 咱们增加textAlign(TextAlign.Center)特点，发现字显现在空间的中间了。

手把手一步一步学鸿蒙（一）

Text(this.message)
  .fontSize(30)//字体大小
  .fontWeight(FontWeight.Bold)//字体粗细
  .fontColor(Color.Blue)//字体色彩
  .width('100%')
  .textAlign(TextAlign.Center)

下面咱们在这个Text下面再写一个Text

手把手一步一步学鸿蒙（一）
咱们想让两个Text有一个距离，能够对下边的Text设置

.margin({top:10})

咱们想让这两行小字的左右两头距离屏幕有个距离，看起来不是那么拥堵，key设置

.padding({left:10,right:10})

咱们想让这两行小字，显现成一行，超出屏幕的显现为…

手把手一步一步学鸿蒙（一）

@Entry
@Component
struct Index {
  @State message: string = '手把手一步一步学鸿蒙'
  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(30)//字体大小
          .fontWeight(FontWeight.Bold)//字体粗细
          .fontColor(Color.Blue)//字体色彩
          .width('100%')
          .textAlign(TextAlign.Center)
        Text("诗曰： 混沌未分天地乱，茫茫渺渺无人见。"  
        "自从盘古破鸿蒙，拓荒从兹清浊辨。"  
        "覆载群生仰至仁，发明万物皆成善。"  
        "欲知造化会元功，须看西游释厄传。")
          .fontSize(10)//字体大小
          .fontWeight(FontWeight.Bold)//字体粗细
          .fontColor(Color.Blue)//字体色彩
          .width('100%')
          .margin({top:10,left:10,right:10})
          .padding({left:10,right:10})
          .maxLines(1)
          .textOverflow({ overflow: TextOverflow.Ellipsis })
      }
      .width('100%')
    }
    .height('100%')
  }
}

最后总结：

本章首要介绍了运用开发工具创立一个项目和Text组件的运用方法。 期望对同学的工作和学习有所协助，假如你觉得文章写得还不错，麻烦点赞、关注和转发，谢谢。

项目地址： gitee.com/jiangnan112…