一、ArkUI的三个重要元素

在鸿蒙ArkTS开发中，每一个页面都离不开三个核心元素，是编写界面的基础固定结构。

@Entry：页面的入口，标志这个页面可以独立运行，作用类似于C语言中的main函数。

@Component：标记这是一个UI组件，只有添加这个标识，页面内容才可以正常显示渲染。

build()：构建组件的核心方法，所有的UI布局、组件编写、样式设置，全部都要写在这个方法内部。

通过基础色块布局案例，我掌握了页面最基础的结构写法，理解了鸿蒙页面的运行规则。

二、垂直布局 Column 属性学习

Column 是垂直布局容器，页面内的子组件会从上到下依次排列。垂直布局的主轴是垂直方向，交叉轴是水平方向。

常用属性：

space：设置组件之间的垂直间距，让竖向排列的内容不会拥挤。

justifyContent：控制主轴（垂直方向）对齐方式，可以实现内容靠上、居中、靠下排列。

alignItems：控制交叉轴（水平方向）对齐方式，可以实现内容靠左、居中、靠右排列。

我利用 Column 垂直布局完成了个人信息页面，将姓名、专业、年级、学号竖向整齐排列，通过设置字体颜色、字体大小、页面背景色，让页面干净整洁，同时通过居中属性让整体内容在页面正中间展示。

三、水平布局 Row 属性学习

Row 是水平布局容器，页面内的子组件会从左到右依次排列。水平布局的主轴是水平方向，交叉轴是垂直方向。

space 属性在 Row 中用于设置组件之间的水平间距。

justifyContent(FlexAlign.Center) 控制水平方向对齐方式。

alignItems(VerticalAlign.Center) 控制垂直方向对齐方式。

我使用 Row 水平布局制作了底部导航栏，将首页、课程、消息、我的四个功能选项横向排列，设置页面宽高、背景颜色和居中对齐，实现了手机端常见的底部导航效果，布局整齐、结构清晰。

四、Column与Row布局区别总结

垂直布局 Column：主轴方向为从上到下，主要用于竖向排列文字、个人信息、列表内容，适合页面主体内容展示。

水平布局 Row：主轴方向为从左到右，主要用于横向排列按钮、导航、功能选项，适合页面局部模块排版。

五、综合布局嵌套练习

在实际页面开发中，单一布局无法满足界面需求，因此需要 Column 和 Row 互相嵌套使用。

我通过外层 Column 整体垂直排布标题、欢迎文字、按钮组，内层 Row 横向排列多个功能按钮，成功制作出学生个人中心页面，实现了编辑资料、修改密码、查看订单、退出登录等功能按钮的整齐布局，页面层次分明、结构完整。

六、学习心得

通过本次 ArkUI 布局学习，我熟练掌握了 @Entry、@Component、build() 的基础用法，分清了 Row 水平布局和 Column 垂直布局的使用场景和对齐规则。

我掌握了间距设置、居中设置、背景色设置、字体样式设置等基础操作，能够独立完成简单鸿蒙页面的编写与运行。同时学会了布局嵌套的思路，能够制作结构更丰富的移动端页面，为后续鸿蒙开发学习打下了扎实的基础。