鸿蒙的组件

最新推荐文章于 2024-09-13 21:50:46 发布

✿小奶兔✿

最新推荐文章于 2024-09-13 21:50:46 发布

阅读量127

点赞数 3

文章标签：华为鸿蒙系统

本文链接：https://blog.csdn.net/Zhao13155/article/details/140698118

版权

border:边框

borderWidth:边框的宽度

borderColor:边框颜色

borderStyle(BorderStyle.Dotted):边框样式

@Entry
@Component
struct Bq2Page {
  @State message: string = 'Hello World';

  build() {
    Column(){
      Text("bq")
        .fontSize(170)
        .fontColor(Color.Gray)

      Column({space:15}){
        Text("欢迎使用 北企管理员端")
          .fontSize(26)
        TextInput({placeholder:"用户名"})
          .borderRadius(0)
          .backgroundColor(Color.White)
          .width("80%")
          .borderWidth(1)//边框的宽度
          .borderColor('#cfcadd')//边框颜色
          .borderStyle(BorderStyle.Dotted)//边框样式

边框简写

 .border({// 统一样式  边框简写
            width:1,
            color:'#cfcadd',
            style:BorderStyle.Solid

          })

Checkbox({name:‘isAgree’})：多选框

Row(){
Checkbox({name:'isAgree'})
  Text('阅读并同意携程的').fontSize(12)
  Text('《服务协议》《个人信息保护政策》')
    .fontSize(12)
    .fontColor('#099fde')
}
.width("90%")

alignItems(HorizontalAlign.Center):水平居中

.justifyContent(FlexAlign.Center):

Column(){
  Image($rawfile("un_other_login@2x_v6.22.png"))
    .height(25)
}
.height(40)
.width(40)
.border({
  width:1,
  radius:90,
  color:"#ccc",
})
.alignItems(HorizontalAlign.Center)//水平居中
 .justifyContent(FlexAlign.Center)//垂直居中