【HarmonyOS NEXT星河版开发学习】小型测试案例05-得物列表项

个人主页→VON

收录专栏→鸿蒙开发小型案例总结​​​​​

基础语法部分会发布于github 和 gitee上面（暂未发布）

 

前言

鸿蒙操作系统通过其先进的分布式架构和开发工具，以及灵活的界面布局和样式控制，为开发者提供了丰富的开发资源和技术支持，使得开发和设计可以更加高效和创新。

知识点概述

1. 鸿蒙操作系统开发：

鸿蒙操作系统（HarmonyOS）是华为公司推出的一款全场景智能操作系统。它被设计用于连接各种设备，实现全场景智能互联。相比传统操作系统，鸿蒙具有分布式架构、统一的开发环境和多设备协同能力，使得开发者可以更轻松地编写应用程序，并在不同设备间实现高效的资源共享和协同工作。

鸿蒙操作系统的开发工具包（HDK）和开发者文档（DevEco）提供了丰富的开发资源和指导，支持开发者利用统一的API和开发语言（如Java、C、C++）跨平台进行应用开发，从智能手机到平板电脑、智能手表、智能家居等多种设备，实现代码复用和快速迭代开发。

2. 交叉轴对齐方式：

在前端开发中，特别是在使用Flexbox布局或者Grid布局时，交叉轴对齐（Cross-axis Alignment）是一个重要的概念。这指的是在Flex容器中，项目沿着交叉轴（与主轴垂直的轴线）的对齐方式。

具体来说，交叉轴对齐方式包括以下几种常见的选项：

• flex-start（起始对齐）： 项目向交叉轴起始位置对齐。
• flex-end（末尾对齐）： 项目向交叉轴末尾位置对齐。
• center（居中对齐）： 项目在交叉轴居中对齐。
• stretch（拉伸对齐）： 如果项目未设置高度或设为auto，将占满整个交叉轴。
• baseline（基线对齐）： 项目根据其基线对齐。

在使用鸿蒙操作系统开发应用时，开发者可以根据具体的布局需求和设计风格选择合适的交叉轴对齐方式。鸿蒙操作系统支持灵活的布局管理和样式控制，使得开发者能够轻松地实现各种复杂的界面布局和交互效果，同时确保在不同设备上的一致性和流畅性。

界面效果展示

代码展示

@Entry
@Component
struct Index {
  build() {
    Column(){
      Row(){
        // 左侧的列
        Column(){
          Text('玩一玩')
            .fontWeight(700)
            .margin({bottom:8})
            .fontSize(18)
          Text('签到兑礼 | 超多大奖 超好玩')
            .fontSize(12)
            .fontColor('#999')
        }
        .alignItems(HorizontalAlign.Start)
        // 右侧的行
        Row(){
          Image($r('app.media.icon'))
            .width(50)
            .margin({right:8})
          Image($r('app.media.ic_public_arrow_right'))
            .width(30)
            .fillColor('#999')
 
        }
      }
      .justifyContent(FlexAlign.SpaceBetween)
      .padding({left:15,right:15})
      .width('100%')
      .height(80)
      .backgroundColor('#fff')
      .borderRadius(10)
    }
    .padding(10)
    .width('100%')
    .height('100%')
    .backgroundColor('#ccc')
  }
}