开发准备
开发基本概念:https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/start-overview-0000001380121578-V3
UI框架
声明式开发范式
使用ArkTS语言进行开发,这个使用于所有开发人群,简单并且容易入门。
类Web开发范式
使用js语言进行开发,相对于web开发人员容易入手
页面介绍
基本操作界面
预览按钮
![](https://img-blog.csdnimg.cn/img_convert/f4a12267aa08f7116a3953ac947402d9.png)
内置API文档查阅
![](https://img-blog.csdnimg.cn/img_convert/ec31b1031fa67ee6a4c56f91f1096a9f.png)
项目设置
![](https://img-blog.csdnimg.cn/img_convert/329651e93f5d5f33e31eb599d9b5a4d1.png)
运行按钮(只有在真机模拟或远程模拟时才可以使用)
![](https://img-blog.csdnimg.cn/img_convert/7e8fc7777ced5f2d90bdb7f488fe6728.png)
目录介绍
stage模型常用模块
![](https://img-blog.csdnimg.cn/img_convert/1ca53098a3f5ec8ef5f8dbe870e07fba.png)
app.json模块
AppScope>app.json5是应用的全局的配置文件,用于存放应用公共的配置信息。
![](https://img-blog.csdnimg.cn/img_convert/100b3b4ee668ff2bc1ed852fd8f46bd9.png)
bundleName是包名。
vendor是应用程序供应商。
versionCode是用于区分应用版本。
versionName是版本号。
icon对于应用的显示图标。
label是应用名。
distributedNotificationEnabled描述应用程序是否已分发通知。
entry模块
编写页面的模块
entry-->src-->main-->ets-->pages
![](https://img-blog.csdnimg.cn/img_convert/8524b9d54bd04882e74d5b03eb5d011b.png)
resources模块
资源配置,即文字和图片及语言的配置。
中文语言en_CN
英文语言en_US
base模块下的profile模块
这个模块包含页面的配置信息,创建的页面这里都要有配置。
![](https://img-blog.csdnimg.cn/img_convert/2f230d1fb91a9c63b6129bef4bdda845.png)
module.json模块
是模块的配置文件,包含当前模块的配置信息
https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/module-configuration-file-0000001434502905-V3
FA模型及常用模块
![](https://img-blog.csdnimg.cn/img_convert/3d128d8baa8e49e5057c2f61339f40bb.png)
entry模块
pages模块
entry-->src-->main-->ets-->pages
![](https://img-blog.csdnimg.cn/img_convert/2b6ba9ee34f537e878e2100777c53804.png)
resource模块
资源配置,即文字和图片及语言的配置。
中文语言en_CN
英文语言en_US
config.json
标识应用的全局配置信息。同一个应用的不同HAP的app配置必须保持一致。
标识应用在具体设备上的配置信息。
标识HAP的配置信息。该标签下的配置只对当前HAP生效。
创建项目
![](https://img-blog.csdnimg.cn/img_convert/1134f970067a24f75a6c673bbc94214e.png)
基础知识
基本框架
@entry-->struct结构体-->build方法-->页面组件
![](https://img-blog.csdnimg.cn/img_convert/c4f1748e90b3b333fe8798936d938157.png)
装饰器
用于装饰类、结构、方法以及变量,赋予其特殊的含义。
装饰器列表
![](https://img-blog.csdnimg.cn/img_convert/0cc58e13ffa34ca0f45c748c127962fc.png)
组件
接口
写在组件里,可以控制组件的一些特性。
text组件接口
接口
![](https://img-blog.csdnimg.cn/img_convert/6ef9ef8d52852bfea0ebc210e2fa256c.png)
![](https://img-blog.csdnimg.cn/img_convert/5f82a711c1a32e572019935d9469e09c.png)
属性
相当于组件的衣服,能够更改组件的颜色、大小、各种样式等。与网页的css的意义一样。
![](https://img-blog.csdnimg.cn/img_convert/babd77701899fa8901742b7df8feb266.png)
事件方法
每个组件可以绑定一个事件,事件可以是点击事件、触摸事件等等。
方法就是事件被触发后要执行的动作。
![](https://img-blog.csdnimg.cn/img_convert/18511f6fd0260527fa665cdbf7d6e7d0.png)
资源引用类型
Resource是资源引用类型
用于设置组件属性的值。推荐大家优先使用Resource类型,将资源文件(字符串、图片、音频等)统一存放于resources目录下,便于开发者统一维护。同时系统可以根据当前配置加载合适的资源,例如,开发者可以根据屏幕尺寸呈现不同的布局效果,或根据语言设置提供不同的字符串。
“$r('app.type.name')”
通过“$r('app.type.name')”的形式引用应用资源。app代表应用内resources目录中定义的资源;type代表资源类型(或资源的存放位置),可以取“color”、“float”、“string”、“plural”、“media”;name代表资源命名,由开发者定义资源时确定。
![](https://img-blog.csdnimg.cn/img_convert/e071a8991e319f962708cd8aa2199167.png)
存放的资源目录
![](https://img-blog.csdnimg.cn/img_convert/7bd411a839081cae0ead06e9c380e7db.png)
数据类型
string、number、number[]、string[]、object[]
更换图标和名字
更换图标
先添加图片
![](https://img-blog.csdnimg.cn/img_convert/aad686073fd7745cd2244d74a3956a60.png)
再修改图片地址
![](https://img-blog.csdnimg.cn/img_convert/73f373bd641c7a93e04d70bd97cb1908.png)
更换名字
修改这个三个地方的value值,即可实现修改名字
![](https://img-blog.csdnimg.cn/img_convert/0e89f49ba4eac6939678a3c9c1576318.png)
![](https://img-blog.csdnimg.cn/img_convert/86eabec7ac75fbf5a82d617e1164253e.png)
![](https://img-blog.csdnimg.cn/img_convert/aabf24ea0a487141a542c16f826cdca8.png)
![](https://img-blog.csdnimg.cn/img_convert/8f95253df659db103d3c5bedef6c85cb.png)
最终效果
![](https://img-blog.csdnimg.cn/img_convert/55d1c0ab1aa8a5eb7fe4d5ea0b96983c.png)