Day01 ArkUI、ArkTS基础知识

创建新项目

愉快的开始写代码了

初识ArkTs

@Entry
@Component
struct Index {
  // @State ---》装饰器，修饰的变量值的改变能引起界面刷新
  // ArkTs是ts的超集 ， 定义变量的时候需要写类型
  @State num: number = 0

  build() {
    // Column 是垂直布局 在build标签的子组件必须是一个 一个 一个 容器组件 ，容器组件在包住其他的
    Column() {
      // ArkTS使用的是声明式UI ，这里是说一个button  点击事件
      Button('--').onClick((event: ClickEvent) => {
        //  看到上面的struct   Index了吗， 这里里面声明的变量需要使用this. 来进行引用
        this.num--
      })
      Button(this.num.toString()).onClick((event: ClickEvent) => {

      })
      Button('++').onClick((event: ClickEvent) => {
        this.num++
      })
    }
  }
}

2. 增添row，大家对比一下效果

@Entry
@Component
struct Index {
  @State num: number = 0

  build() {
    Column() {
      // row 也是容器组件 横向排列 ，经常于column进行联合使用
      Row() {
        Button('--').onClick((event: ClickEvent) => {
          this.num--
        })
        Button(this.num.toString()).onClick((event: ClickEvent) => {

        })
        Button('++').onClick((event: ClickEvent) => {
          this.num++
        })
      }

    }
  }
}

通过上面一些基础讲解，大家已经会写鸿蒙了， 下一篇我会大家写一个小demo

git仓库地址：gitee.com/crayon-shin…