鸿蒙学习路线图-Arkts基础知识

180 阅读4分钟

1、鸿蒙学习开发环境准备

开发工具下载: developer.huawei.com/consumer/cn…

image.png 该版本适用HarmonyOS和OpenHarmony应用及服务开发,您可体验HarmonyOS 3.1 版本及以下的开发能力,在使用过程中如遇到问题请积极反馈,我们将在后续版本中进行优化,点击查看版本说明

安装要求

  • 安装路径不要有中文

image.png

2、 ArkTS 基础快速入门:

ArkTS 是一门用于开发鸿蒙应用的编程语言

机制: 编写代码 → 编译运行 → 查看效果

2.1、数据存储和数据定义

  1. 变量 let
  2. 常量 const
  3. 对象 interface 定义对象,属性和方法
  4. 函数:普通函数 箭头函数
  5. 数据类型: string,number,boolean,联合数据类型(let gender:"man"|"woman"|"ser";gender="woman"),枚举(enum定义),

2.2、 界面开发

页面内容

所有组件都必须放在build(){}中,

2.2.1、布局组件

image.png

声明式UI提供了以下9种常见布局,开发者可根据实际应用场景选择合适的布局进行页面开发。

布局应用场景
线性布局(Row、Column)如果布局内子元素超过1个,且能够以某种方式线性排列时优先考虑此布局。
层叠布局(Stack)组件需要有堆叠效果时优先考虑此布局,层叠布局的堆叠效果不会占用或影响其他同容器内子组件的布局空间。例如Panel作为子组件弹出时将其他组件覆盖更为合理,则优先考虑在外层使用堆叠布局。
弹性布局(Flex)弹性布局是与线性布局类似的布局方式。区别在于弹性布局默认能够使子组件压缩或拉伸。在子组件需要计算拉伸或压缩比例时优先使用此布局,可使得多个容器内子组件能有更好的视觉上的填充容器效果。
相对布局(RelativeContainer)相对布局是在二维空间中的布局方式,不需要遵循线性布局的规则,布局方式更为自由。通过在子组件上设置锚点规则(AlignRules)使子组件能够将自己在横轴、纵轴中的位置与容器或容器内其他子组件的位置对齐。设置的锚点规则可以天然支持子元素压缩、拉伸,堆叠或形成多行效果。在页面元素分布复杂或通过线性布局会使容器嵌套层数过深时推荐使用。
栅格布局(GridRow、GridCol)栅格是多设备场景下通用的辅助定位工具,通过将空间分割为有规律的栅格。栅格不同于网格布局固定的空间划分,它可以实现不同设备下不同的布局,空间划分更随心所欲,从而显著降低适配不同屏幕尺寸的设计及开发成本,使得整体设计和开发流程更有秩序和节奏感,同时也保证多设备上应用显示的协调性和一致性,提升用户体验。推荐手机、大屏、平板等不同设备,内容相同但布局不同时使用。
媒体查询(@ohos.mediaquery)媒体查询可根据不同设备类型或同设备不同状态修改应用的样式。例如根据设备和应用的不同属性信息设计不同的布局,以及屏幕发生动态改变时更新应用的页面布局。
列表(List)使用列表可以轻松高效地显示结构化、可滚动的信息。在ArkUI中,列表具有垂直和水平布局能力和自适应交叉轴方向上排列个数的布局能力,超出屏幕时可以滚动。列表适合用于呈现同类数据类型或数据类型集,例如图片和文本。
网格(Grid)网格布局具有较强的页面均分能力,子组件占比控制能力,是一种重要自适应布局。网格布局可以控制元素所占的网格数量、设置子组件横跨几行或者几列,当网格容器尺寸发生变化时,所有子组件以及间距等比例调整。推荐在需要按照固定比例或者均匀分配空间的布局场景下使用,例如计算器、相册、日历等。
轮播(Swiper)轮播组件通常用于实现广告轮播、图片预览、可滚动应用等。

2.2.2、基础组件 42个

详情可以参考:developer.huawei.com/consumer/cn…