鸿蒙开发之系统基础组件

发布时间 2023-12-20 21:58:09作者: 谢玉胜

应用page的组成部分是 组件组成的, 系统提供了很多的组件

Image/Text

Image组件

Image($r('app.media.logo'))
    .width(78)
    .height(509)

使用string 设置 
.width('78vp') // vp vm的像素单位

使用定义资源json
.width($r('app.float.logo_size'))

在resources 目录下 定义这个应该是借鉴了安卓的资源管理
{
  "float": [{
    
"name": "logo_size",
"value": "78vp"
  }]  
}

 组件的组合

@Entry。//入口
@Component //组件
//结构
struct Index {
  @State message: string = 'Hello World' //变量

  // 页面组合
  build() {
    Row() {
      Column() {
        Text(this.message) //文本
          .fontSize(50)。//文本大小
          .fontWeight(FontWeight.Bold)
      }
      .width('100%')
    }
    .height('100%')
  }
}

 具体组件的使用方式参考: https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101682410994903854