@Entry@Componentstruct Index { @State message: string = 'Hello World'; build() { Column() { //顶部区域 Row(){ Image($r('app.media.ic_public_cancel')) .width(20) .fillColor(Color.White) Text('帮助') .fontSize(16) .fontColor(Color.White) }.justifyContent(FlexAlign.SpaceBetween) .width('100%') //logo图片 Image($r('app.media.APP')) .width(250) .height(250) //国家/地址 Row(){ Text('国家/地址') .fontColor(Color.Gray) .layoutWeight(1) Text('中国(+86)') .fontColor(Color.Gray) .margin({ right:5 }) Image($r('app.media.swore_right')) .width(16) .fillColor(Color.Gray) } .width('100%') .height(40) .backgroundColor(Color.White) .justifyContent(FlexAlign.SpaceBetween) .borderRadius(20) .padding({ right:10, left:15 }) .margin({ top:5, bottom:20 }) //电话号码 TextInput({placeholder:'请输入电话号码'}) .backgroundColor(Color.White) .width('100%') .height(40) .borderRadius(20) .margin({ bottom:20 }) //协议 Row(){ Checkbox() .unselectedColor(Color.White) .width(10) .margin({ top:0 }) Text(){ Span('我已阅读并同意') Span('《隐私政策》') .fontColor(Color.Red) Span('《用户服务协议》') .fontColor(Color.Red) Span('未注册的电话号码将会创建账号') } .fontSize(12) .fontWeight(FontWeight.Bold) .height(20) } //登录按钮 Button('登录') .margin({ top:35 }) .height(40) .width('100%') .backgroundColor(Color.Red) //其他 Row(){ Text('新用户注册') .fontColor(Color.Black) .fontSize(14) Text('账户密码登录') .fontColor(Color.Black) .fontSize(14) Text('无法登陆') .fontColor(Color.Black) .fontSize(14) } .margin({ top:10 }) .width('95%') .justifyContent(FlexAlign.SpaceBetween) //底部 Blank() Column(){ Text('其他登录方式') .fontSize(14) .height(22) .fontWeight(FontWeight.Bold) Row(){ Image($r('app.media.HUAWEI_logo')) .width(40) Image($r('app.media.weibo_logo')) .width(34) .fillColor('#ffff1700') Image($r('app.media.WeChat_logo')) .width(34) .fillColor('#ff23ff00') Image($r('app.media.QQ_logo')) .width(34) .fillColor('#ff0099fc') } .margin({ top:28, bottom:20 }) .width('100%') .justifyContent(FlexAlign.SpaceBetween) } } .padding(20) .width('100%') .height('100%') .backgroundImage($r('app.media.background1')) .backgroundImageSize(ImageSize.Cover) }}