HarmonyOS实现如图简单页面

HarmonyOS实现如图简单页面_第1张图片

@Entry
@Component
struct Index {
  @State message: string = '';

  build() {
    Column(){
    Row(){
      Column(){
        Text('玩一玩')
          .fontSize(18)
          .fontWeight(FontWeight.Bold)
        Text('签到兑礼 | 超多大奖 超好玩')
          .fontSize(12)
          .fontColor('#999')
      }
      .margin(10)
      .alignItems(HorizontalAlign.Start)
      Row({space:10}){
        Image($r('app.media.tree'))
          .width(50)
          .backgroundColor('#efefef')
          .borderRadius(5)
        Image($r('app.media.ic_arrow_right'))
          .width(20)
          .fillColor('#999')
      }
  }
    .justifyContent(FlexAlign.SpaceBetween)
    .padding({left:15,right:15})
      .width('100%')
      .height(80)
      .backgroundColor(Color.White)
      .borderRadius(5)
    }
    .width('100%')
    .height('100%')
    .backgroundColor('#ccc')
    .padding(10)

  }
}

你可能感兴趣的:(鸿蒙系统开发,typescript)