鸿蒙基础入门 01

#基础入门

1. 交叉轴对齐方式 (Cross-axis Alignment)

• 在 Flex 布局中，交叉轴是与主轴垂直的方向。可以使用 align-items 和 align-self 来调整子元素在交叉轴上的对齐方式。

常见对齐方式：

• flex-start：子元素从交叉轴的起始位置对齐。

• flex-end：子元素从交叉轴的末尾对齐。

• center：子元素在交叉轴上居中。

• stretch：子元素在交叉轴上拉伸以填充容器。

2. 自适应伸缩 (Responsive Stretching)

• 使用

• ,

• 和

• 属性来实现子元素在主轴方向上的自适应伸缩。

• flex-grow：定义元素如何占据主轴上的剩余空间。

• flex-shrink：定义元素在主轴上如何收缩。

• flex-basis：定义元素的初始大小。

3. 弹性布局 Flex (Flex Layout)

• Flex 布局是一种一维布局方式。启用 Flex 布局后，容器内的元素会自动根据主轴和交叉轴的属性进行排列。

• 可以通过 flex-direction 属性来设置主轴方向，如 row（水平）和 column（垂直）。

4. 绝对定位和层级

• 绝对定位：通过 position: absolute 或 position: fixed 来定位元素，通常是相对于最近的已定位父元素。

• 层级管理：通过 z-index 属性控制元素的堆叠顺序。z-index 值大的元素会覆盖在值小的元素之上。

5. 层叠布局 (Stacking Layout)

• 在层叠布局中，多个元素可能会在视觉上重叠。通过 z-index 控制它们的显示顺序。

6. 字符串拼接 (String Concatenation)

• 使用

• 运算符将多个字符串连接在一起：

7. 模板字符串 (Template Strings)

• 使用反引号（

• ）定义模板字符串，可以嵌入变量和表达式，使字符串拼接更为简洁：

8. 交互点击事件 (Click Event)

• 在鸿蒙开发中，可以为元素添加点击事件，通常使用

• 方法来实现：

9. 状态管理

• 状态管理在开发中用于管理应用的状态和数据流。它帮助确保数据的一致性和应用的响应性。

• 在鸿蒙开发中，可以通过 Observer 模式、DataBinding 或状态管理库来实现。

10. 算术运算符 (Arithmetic Operators)

• 处理数值计算的常见运算符：

• + 加法

• - 减法

• * 乘法

• / 除法

• % 取余

• ++ 自增

• -- 自减

11. 赋值运算符 (Assignment Operators)

• 用于将值赋给变量的运算符：

• = 简单赋值

• += 加法赋值

• -= 减法赋值

• *= 乘法赋值

• /= 除法赋值

• %= 取余赋值

12. 点赞功能 (Like Feature)

• 使用按钮和点击事件实现点赞功能。例如，点击按钮时点赞数加一：

13. 一元运算符 (Unary Operators)

• 一元运算符作用于单个操作数，常见的一元运算符包括：

• + 一元加法

• - 一元减法

• ++ 自增

• -- 自减

• ! 逻辑非

14. 比较运算符 (Comparison Operators)

• 用于比较两个值之间的关系：

• == 等于

• === 严格等于

• != 不等于

• !== 严格不等于

• > 大于

• < 小于

• >= 大于或等于

• <= 小于或等于

15. 逻辑运算符 (Logical Operators)

• 逻辑运算符用于结合多个布尔表达式，常见的有：

• && 逻辑与

• || 逻辑或

• ! 逻辑非

16. Stack 布局

• Stack 布局是堆叠式布局，元素可以重叠显示。常用于一些浮动或定位效果中，可以通过 position: absolute 和 z-index 实现。

17. Scroll（滚动）

• 滚动通常用于展示大量内容，鸿蒙开发中可以使用 scroll 组件实现。通过设置容器的 overflow 属性，可以控制内容区域是否允许滚动。

• 常见的滚动属性：

• overflow: auto：如果内容溢出，显示滚动条。

• overflow: scroll：始终显示滚动条。

• overflow: hidden：隐藏超出的内容。