华为鸿蒙运行Hello World

news2024/12/23 14:08:14

前言：
从11月中旬开始通过B站帝心接触鸿蒙，至今一个半月左右不到，从小白到入坑，再到看官网案例，分析案例，了解技术点，还需要理清思路，再写博客，在决定写 ＜HarmonyOS第一课＞构建更加丰富的页面之前，差点一度放弃了，新手村的案例就这么难，导致我花了很久的时间去研究，一步一步分析，CPU都烧坏了。
痛定思痛，还是从基础部分开始，夯实基础！！！
还是从官网笔记开始，在学习之前建议学完帝心视频或者黑马程序员视频

下载与安装DevEco Studio

在HarmonyOS应用开发学习之前，需要进行一些准备工作，首先需要完成开发工具DevEco Studio的下载与安装以及环境配置。

进入DevEco Studio下载官网，单击“立即下载”进入下载页面。
在这里插入图片描述
DevEco Studio提供了Windows版本和Mac版本选择，可以根据操作系统选择对应的版本进行下载。

这里以Windows为例进行安装。

下载完成后，双击下载的“deveco-studio-xxxx.exe”，进入DevEco Studio安装向导，在如下界面选择安装路径，默认安装于“C:\Program Files”下，也可以单击“Browse…”指定其他安装路径，然后单击“Next”。
在这里插入图片描述
如下安装选项界面勾选DevEco Studio后，单击“Next”，直至安装完成。
在这里插入图片描述安装完成后，单击“Finish”完成安装。
在这里插入图片描述

配置环境

双击已安装的DevEco Studio快捷方式进入配置页面，IDE会进入配置向导，选择Agree，同意相应的条款，进入配置页。
在这里插入图片描述
进入DevEco Studio配置页面，首先需要进行基础配置，包括Node.js与Ohpm的安装路径设置，选择从华为镜像下载至合适的路径。
在这里插入图片描述
单击’Next’进入SDK配置，设置为合适的路径，
在这里插入图片描述
点击’Next’后会显示’SDK License Agreement’，阅读相关协议后，勾选’Accept’。
在这里插入图片描述
单击‘Next’进入配置预览页，在这里进行配置项的确认。
在这里插入图片描述
确认完成后，单击’Next’，进入下一步。
在这里插入图片描述
等待配置自动下载完成，完成后，单击’Finish’，IDE会进入欢迎页，我们也就成功配置好了开发环境。
在这里插入图片描述准备工作完成后，接下来将进入DevEco Studio进行工程创建和运行。

创建项目

如果你是首次打开DevEco Studio，那么首先会进入欢迎页。
在这里插入图片描述

在欢迎页中单击Create Project，进入项目创建页面。
在这里插入图片描述
选择‘Application’，然后选择‘Empty Ability’，单击‘Next’进入工程配置页。
在这里插入图片描述
配置页中，详细信息如下：

  • Project name是开发者可以自行设置的项目名称，这里根据自己选择修改为自己项目名称。
  • Bundle name是包名称，默认情况下应用ID也会使用该名称，应用发布时对应的ID需要保持一致。
  • Save location为工程保存路径，建议用户自行设置相应位置。
  • Compile SDK是编译的API版本，这里默认选择API9。
  • Model选择Stage模型，其他保持默认即可。
    然后单击“Finish”完成工程创建，等待工程同步完成。

认识DevEco Studio界面

进入IDE后，我们首先了解一下基础的界面。整个IDE的界面大致上可以分为四个部分，分别是代码编辑区、通知栏、工程目录区以及预览区。

在这里插入图片描述

  1. 代码编辑区
    中间的是代码编辑区，你可以在这里修改你的代码，以及切换显示的文件。通过按住Ctrl加鼠标滚轮，可以实现界面的放大与缩小。
  2. 通知栏
    在这里插入图片描述
    在编辑器底部有一行工具栏，主要介绍常用信息栏，其中Run是项目运行时的信息栏，Problems是当前工程错误与提醒信息栏，Terminal是命令行终端，在这里执行命令行操作，PreviewerLog是预览器日志输出栏，Log是模拟器和真机运行时的日志输出栏。在后续使用中会陆续接触。
  3. 工程目录区
    左侧为工程目录区，后续章节会详细介绍
    在这里插入图片描述
  4. 预览区
    单击右上角Previewer，可以预览相应的文件UI展示效果。
    在这里插入图片描述
    预览器提供了一些基本功能，包括旋转屏幕，切换显示设备及多设备预览等。单击旋转按钮，可以切换竖屏和横屏显示的效果。
    在这里插入图片描述
    也可以单击如下列表按钮，切换显示的设备类型。弹出框内会显示Available Profiles，即可用的设备类型。
    在这里插入图片描述
    如单击Foldable切换设备，也可以单击旋转按钮切换Foldable的横竖屏显示模式。
    打开Muti-profile preview开关，可以实现多个尺寸设备的实时预览。
    点击放大
    单击预览器右上角组件预览按钮，可以进入组件预览界面。
    在这里插入图片描述
    组件预览模式可以预览当前组件对应的代码块。
    点击相应组件，代码文件中会框选对应的组件代码部分，下方则对应当前组件的基本属性。
    在这里插入图片描述

运行Hello World

IDE提供了本地模拟器供开发者使用，我们首先需要下载安装本地模拟器，然后进行运行工程。

  1. 单击顶部工具栏Tools>Device Manager。
    在这里插入图片描述
  2. 选择Local Emulator，设置合适的Local Emulator Location存储地址，然后单击’+New Emulator’。
    在这里插入图片描述
    选择Huawei_Phone手机模拟器，单击’Next’，进入模拟器系统下载页。
    在这里插入图片描述
    选择下载api9的系统镜像，然后单击’Next’，等待下载完成。
    在这里插入图片描述
    下载完成后，进行创建相应的手机模拟器，单击Finish完成创建。
    在这里插入图片描述
    下载完成后，在Local Emulator页面中会出现创建的手机模拟器，点击Actions按钮，就能够启动模拟器。
    在这里插入图片描述
    模拟器启动后，点击上方启动按钮，将Hello World工程运行到模拟器上。
    在这里插入图片描述
    IDE构建完成后，即可在模拟器上看到运行效果，我们也就完成了Hello World工程在模拟器上的运行。
    在这里插入图片描述

了解基本工程目录

工程级目录

工程的目录结构如下。
在这里插入图片描述
其中详细如下：

  • AppScope中存放应用全局所需要的资源文件。
  • entry是应用的主模块，存放HarmonyOS应用的代码、资源等。
  • oh_modules是工程的依赖包，存放工程依赖的源文件。
  • build-profile.json5是工程级配置信息，包括签名、产品配置等。
  • hvigorfile.ts是工程级编译构建任务脚本，hvigor是基于任务管理机制实现的一款全新的自动化构建工具，主要提供任务注册编排，工程模型管理、配置管理等核心能力。
  • oh-package.json5是工程级依赖配置文件，用于记录引入包的配置信息。

在AppScope，其中有resources文件夹和配置文件app.json5。AppScope>resources>base中包含element和media两个文件夹，

  • 其中element文件夹主要存放公共的字符串、布局文件等资源。
  • media存放全局公共的多媒体资源文件。

在这里插入图片描述

模块级目录

在这里插入图片描述
entry>src目录中主要包含总的main文件夹，单元测试目录ohosTest，以及模块级的配置文件。

  • main文件夹中，ets文件夹用于存放ets代码，resources文件存放模块内的多媒体及布局文件等，module.json5文件为模块的配置文件。
  • ohosTest是单元测试目录。
  • build-profile.json5是模块级配置信息，包括编译构建配置项。
  • hvigorfile.ts文件是模块级构建脚本。
  • oh-package.json5是模块级依赖配置信息文件。

进入src>main>ets目录中，其分为entryability、pages两个文件夹。

  • entryability存放ability文件，用于当前ability应用逻辑和生命周期管理。
  • pages存放UI界面相关代码文件，初始会生成一个Index页面。

在这里插入图片描述
resources目录下存放模块公共的多媒体、字符串及布局文件等资源，分别存放在element、media文件夹中。
在这里插入图片描述

app.json5

AppScope > app.json5是应用的全局的配置文件，用于存放应用公共的配置信息。
在这里插入图片描述
其中配置信息如下：

  • bundleName是包名。
  • vendor是应用程序供应商。
  • versionCode是用于区分应用版本。
  • versionName是版本号。
  • icon对应于应用的显示图标。
  • label是应用名。

module.json5

entry>src>main>module.json5是模块的配置文件，包含当前模块的配置信息。
在这里插入图片描述
其中module对应的是模块的配置信息，一个模块对应一个打包后的hap包，hap包全称是HarmonyOS Ability Package，其中包含了ability、第三方库、资源和配置文件。其具体属性及其描述可以参照下表1。

表1 module.json5默认配置属性及描述
在这里插入图片描述
对于abilities中每一个ability的属性项，其描述信息如下表2。
表2 abilities中对象的默认配置属性及描述
在这里插入图片描述

main_pages.json

src/main/resources/base/profile/main_pages.json文件保存的是页面page的路径配置信息，所有需要进行路由跳转的page页面都要在这里进行配置。
在这里插入图片描述

参考链接

DevEco Studio下载与安装：DevEco Studio下载与安装
配置开发环境：配置开发环境

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1350775.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

七、HTML 文本格式化

七、HTML 文本格式化

一、HTML 文本格式化 加粗文本斜体文本电脑自动输出 这是 下标 和 上标 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>HTML文本格式化</title> </head><body><b>加粗文本</b><br>…
阅读更多...
商用密码应用安全评估实施方案(50页PPT)

商用密码应用安全评估实施方案(50页PPT)

商用密码应用安全评估:简称密评&#xff0c;是指在采用商用密码技术、产品和服务集成建设的网络和信息系统中&#xff0c;对其密码应用的合规性、正确性和有效性进行评估的过程。这一评估过程是根据《中华人民共和国密码法》等相关法规和标准进行的。 合规性评估主要是检查密码…
阅读更多...
Premiere Pro教程(全)

Premiere Pro教程(全)

项目面板 素材箱 工具面板 轨道选择工具 波纹编辑工具 视频裁剪工具 时间轴面板 时间轴相关快捷键 素材编辑 源面板 插入 节目面板 基本声音 效果面板 效果快捷键 视频效果 视频过渡 全部面板 通用快捷键 效果控件 效果控件概述 码表 运动 不透明度 字幕组 字幕…
阅读更多...
7+WGCNA+机器学习+泛癌生信思路,非肿瘤也能结合泛癌分析

7+WGCNA+机器学习+泛癌生信思路,非肿瘤也能结合泛癌分析

今天给同学们分享一篇生信文章“Analysis and Experimental Validation of Rheumatoid Arthritis Innate Immunity Gene CYFIP2 and Pan-Cancer”&#xff0c;这篇文章发表在Front Immunol期刊上&#xff0c;影响因子为7.3。 结果解读&#xff1a; DEG筛选和数据预处理 数据在…
阅读更多...
Vue3复习笔记

Vue3复习笔记

目录 挂载全局属性和方法 v-bind一次绑定多个值 v-bind用在样式中 Vue指令绑定值 Vue指令绑定属性 动态属性的约束 Dom更新时机 ”可写的“计算属性 v-if与v-for不建议同时使用 v-for遍历对象 数组变化检测 事件修饰符 v-model用在表单类标签上 v-model还可以绑定…
阅读更多...
HTML5+CSS3④——选择器、复合选择器

HTML5+CSS3④——选择器、复合选择器

目录 选择器 标签选择器 类选择器 id选择器 通配符选择器 复合选择器 后代选择器 子代选择器 并集选择器 交集选择器 选择器 标签选择器 类选择器 id选择器 通配符选择器 复合选择器 后代选择器 子代选择器 并集选择器 交集选择器
阅读更多...
dns主从搭建测试

dns主从搭建测试

一、DNS的介绍 1、DNS&#xff1a;Domain Name System&#xff0c;域名系统。将主机名解析为IP地址的过程&#xff0c;完成从域名到主机识别ip地址之间的转换&#xff0c;如&#xff1a;www.baidu.com, 其中 www为主机名&#xff0c;baidu.com为域名。 2、DNS无论是走TCP,还是走…
阅读更多...
Latex使用BibTeX添加参考文献，保持专有名词原格式，如全部大写方法

Latex使用BibTeX添加参考文献，保持专有名词原格式，如全部大写方法

一、背景 当我们使用Latex写文章时&#xff0c;通常使用BibTeX的方式添加参考文献&#xff0c;这种方式非常方便&#xff0c;可以使用期刊定义好的参考文献格式。但有时&#xff0c;某篇参考文献题目中含有专有名词时&#xff0c;如DMPs&#xff0c;参考文献会自动将其转为小写…
阅读更多...
密码学：一文读懂非对称密码体制

密码学：一文读懂非对称密码体制

文章目录 前言非对称密码体制的保密通信模型私钥加密-公钥解密的保密通信模型公钥加密-私钥解密的保密通信模型 复合式的非对称密码系统散列函数数字签名数字签名满足的三个基本要求先加密还是先签名&#xff1f;数字签名成为公钥基础设施以及许多网络安全机制的基础什么是单向…
阅读更多...
【数据结构】七、图

【数据结构】七、图

一、概念 图&#xff1a;记为G(V,E) 有向图&#xff1a;每条边都有方向 无向图&#xff1a;边无方向 完全图&#xff1a;每个顶点都与剩下的所有顶点相连 完全有向图有n(n-1)条边&#xff1b;完全无向图有n(n-1)/2条边 对于完全无向图&#xff0c;第一个节点与剩下n-1个节点…
阅读更多...
本地生活服务再起波澜，这些数据告诉你该选哪些行业？

本地生活服务再起波澜，这些数据告诉你该选哪些行业？

当地生活领域的竞争异常激烈&#xff0c;市场形势也在发生变化&#xff0c;以"变革、拓展、创新、尝试"为中心的当地生活领域每天都有新的故事。艾瑞咨询的数据显示&#xff0c;2020年中国当地生活服务市场规模达到19.5万亿元&#xff0c;预计到2025年&#xff0c;这…
阅读更多...
众和策略股市行情分析：为什么不建议在登记日前买入股票？

众和策略股市行情分析：为什么不建议在登记日前买入股票？

为什么不主张在挂号日前买入股票&#xff1f; 之所以不主张在挂号日前买入股票&#xff0c;是因为挂号日之后股票会除息&#xff0c;从而使得股价跌落。而挂号日前买入虽说可以享有当期分红&#xff0c;但持股达不到一定年限的&#xff0c;分红是需要付税的&#xff0c;所以不…
阅读更多...
常用环境部署(十三)——GitLab整体备份及迁移

常用环境部署(十三)——GitLab整体备份及迁移

一、GitLab备份 注意&#xff1a;由于我的GitLab是docker安装的&#xff0c;所以我的操作都是在容器内操作的&#xff0c;大家如果不是用docker安装的则直接执行命令就行。 1、Docker安装GitLab 链接&#xff1a;常用环境部署(八)——Docker安装GitLab-CSDN博客 2、GitLab备…
阅读更多...
DNS测试和管理工具

DNS测试和管理工具

一、dig 命令 说明&#xff1a; &#xff08;1&#xff09;dig只用于测试dns系统&#xff0c;不会查询hosts文件进行解析。 &#xff08;2&#xff09;加"server-ip"&#xff1a;根据指定的DNS服务器来解析&#xff0c;绕过了本地解析库中设置的DNS服务器。 &…
阅读更多...
Model::unguard()的作用

Model::unguard()的作用

这是在生成假数据时碰见的&#xff0c;浅查了一下 Model::unguard() 是 Laravel 框架中的一个方法&#xff0c;它的作用是取消对 Eloquent 模型的属性赋值的安全性保护。 在默认情况下&#xff0c;Laravel 的 Eloquent 模型会对属性赋值做一些安全性检查&#xff0c;例如防止…
阅读更多...
实现区域地图散点图效果,vue+echart地图+散点图

实现区域地图散点图效果,vue+echart地图+散点图

需求&#xff1a;根据后端返回的定位坐标数据实现定位渲染 1.效果图 2.准备工作,在main.js和index.js文件中添加以下内容 main.js app.use(BaiduMap, {// ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */ak: sRDDfAKpCSG5iF1rvwph4Q95M…
阅读更多...
ARM CCA机密计算架构软件栈之软件组件介绍

ARM CCA机密计算架构软件栈之软件组件介绍

在本节中，您将了解Arm CCA的软件组件，包括Realm World和Monitor Root World。以下图表展示了Arm CCA系统中的软件组件： 在这个图表中，世界之间的边界显示为粗虚线。由较高权限的软件强制执行的较低权限软件组件之间的边界显示为细虚线。例如，非安全EL2处的虚拟机监视器强制…
阅读更多...
QT上位机开发（会员管理软件）

QT上位机开发（会员管理软件）

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 前面我们学习了ini文件的解析办法&#xff0c;通过QSettings类就可以很轻松地访问ini文件里面的数据。除了ini文件之外&#xff0c;另外一种经常出…
阅读更多...
安装 Node.js、npm

安装 Node.js、npm

安装 nodejs 安装Node.js的最简单的方法是通过软件包管理器。 Node.js官网&#xff1a;https://nodejs.org/en/download/ cd /usr/local/src/wget -c https://nodejs.org/dist/v18.16.0/node-v18.16.0-linux-x64.tar.xz xz -d node-v18.16.0-linux-x64.tar.xz tar -xf node…
阅读更多...
探究Chrome仿真模拟设备时Click区域不准确问题

探究Chrome仿真模拟设备时Click区域不准确问题

一、开发环境 windows版本&#xff1a; windows 10 Chrome 版本&#xff1a; 116.0.5845.141 二、问题描述 在Chrome DevTools中开启仿真设备&#xff08;微信开发者工具也有类似问题&#xff09;&#xff0c;如果页面元素有绑定click时&#xff0c;实际点击事件响应区域会…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023