【鸿蒙学习笔记】属性学习迭代笔记

这里写目录标题

Text

cpp 复制代码
@Entry
@Component
struct PracExample {
  build() {
    Row() {
      Text('文本描述')
        .fontSize(40)// 字体大小
        .fontWeight(FontWeight.Bold)// 加粗
        .fontColor(Color.Blue)// 字体颜色
        .backgroundColor(Color.Red)// 背景颜色
        .width('50%')// 组件宽度
        .height("50")// 组件高度
        .size({ width: '80%', height: '70' })// 组件高宽  谁在下面以谁为主
        .borderRadius(20) // 四个角圆曲度
        .border({ width: 3, style: BorderStyle.Dashed })// 组件边框
        .margin(40)// 外边距
        .padding(15)// 内边距
        .textAlign(TextAlign.Center)// 字体居中
        .opacity(0.7) // 透明度
    }.backgroundColor(Color.Yellow)
  }
}

Image

cpp 复制代码
Image($r('app.media.zhibo'))
  .width(96)
  .height(96)
  .borderRadius(12)
  .objectFit(ImageFit.Fill) // 不明

Column

cpp 复制代码
@Entry
@Component
struct PracExample {
  build() {
    Column({ space: 10 }) {
      Text('文本描述').size({ width: '80%', height: '60' }).backgroundColor(Color.Red)
    }
    .width('100%')
    .height(150)
    .backgroundColor(Color.Pink)
    .border({ radius: { topLeft: 15, topRight: 15, } })
    .borderRadius(12)
    .margin(20)
    .padding(10)
    .alignItems(HorizontalAlign.Start) // 元素位置
    .justifyContent(FlexAlign.Center) // 主轴对齐方式
  }
}

Row

cpp 复制代码
Row() {

}
.alignItems(VerticalAlign.Center)
相关推荐
_落纸2 天前
三大基础无源电子元件——电阻(R)、电感(L)、电容(C)
笔记
Alice-YUE2 天前
【CSS学习笔记3】css特性
前端·css·笔记·html
2303_Alpha2 天前
SpringBoot
笔记·学习
萘柰奈2 天前
Unity学习----【进阶】TextMeshPro学习(三)--进阶知识点(TMP基础设置,材质球相关,两个辅助工具类)
学习·unity
沐矢羽2 天前
Tomcat PUT方法任意写文件漏洞学习
学习·tomcat
好奇龙猫2 天前
日语学习-日语知识点小记-进阶-JLPT-N1阶段蓝宝书,共120语法(10):91-100语法+考え方13
学习
向阳花开_miemie2 天前
Android音频学习(十八)——混音流程
学习·音视频
工大一只猿2 天前
51单片机学习
嵌入式硬件·学习·51单片机
c0d1ng2 天前
量子计算学习(第十四周周报)
学习·量子计算
Hello_Embed3 天前
STM32HAL 快速入门(二十):UART 中断改进 —— 环形缓冲区解决数据丢失
笔记·stm32·单片机·学习·嵌入式软件