【HarmonyOS应用开发】开发介绍 DevEco Studio安装与使用(一)

news2025/1/12 4:51:09

内容比较长,干货满满,全是实战操作内容,希望耐心观看,如果对你有所帮助,请点个赞!
在这里插入图片描述

官方文档:https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101667303102887820

访问上面官方地址可观看视频:

在这里插入图片描述

一、下载与安装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.jsOhpm的安装路径设置,选择从华为镜像下载至合适的路径。
    在这里插入图片描述
  • 单击’Next’进入SDK配置,设置为合适的路径
    在这里插入图片描述
  • 确认完成后,单击’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’。

选择Local Emulator,设置合适的Local Emulator Location存储地址,然后单击’+New Emulator’。

在这里插入图片描述

选择Huawei_Phone手机模拟器,单击’Next’,进入模拟器系统下载页。

在这里插入图片描述选择下载api9的系统镜像,然后单击’Next’,等待下载完成。

在这里插入图片描述
下载完成后,进行创建相应的手机模拟器,单击Finish完成创建。

在这里插入图片描述

下载完成后,在Local Emulator页面中会出现创建的手机模拟器,点击Actions按钮,就能够启动模拟器。

在这里插入图片描述

模拟器启动后,点击上方启动按钮,将Hello World工程运行到模拟器上。

在这里插入图片描述

IDE构建完成后,即可在模拟器上看到运行效果,我们也就完成了Hello World工程在模拟器上的运行。

在这里插入图片描述

六、了解基本工程目录

1、工程级目录

工程的目录结构如下。

在这里插入图片描述

其中详细如下:

  • 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存放全局公共的多媒体资源文件。

在这里插入图片描述

2、模块级目录

在这里插入图片描述
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文件夹中。

在这里插入图片描述

3、app.json5

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

其中配置信息如下:

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

entry>src>main>module.json5是模块的配置文件,包含当前模块的配置信息。

在这里插入图片描述其中module对应的是模块的配置信息,一个模块对应一个打包后的hap包,hap包全称是HarmonyOS Ability Package,其中包含了ability、第三方库、资源和配置文件。

5、main_pages.json

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

在这里插入图片描述

系列下一篇,敬请期待。请留下个赞。

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

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

相关文章

华为OD-华为机试精讲500篇系列文章目录介绍(持续补充ing)

目录 背景介绍 什么是华为OD? OD现状 OD趋势 华为OD机考刷题攻略 1、刷题资料:投递岗位通过筛选后提供 2、注意事项: 真题代码目录 背景介绍 经济下行的这几年,每个人都感同身受,如何让自己在芸芸众生中脱颖而…

ubuntu中的rsyslog

目录 1. rsyslog简介 2. 查看/var/log 3. syslog的配置文件 3.1 /etc/rsyslog.d/50-default.conf 3.2 /etc/rsyslog.conf 4. 如何写入syslog 4.1 C语言 4.2 shell 4.3 内核输出 5. syslog.1和syslog.2.gz等文件是如何生成 6. logrotate是如何被执行 7. 如何限制sys…

linux 运行vue项目

1:在本地电脑 项目跟目录 执行 npm run build 在根目录生成文件夹 dist 2:复制dist 到linux 上 /usr/vuespace/ledger-web/dist 3: 配置nginx server {listen 443 ssl;server_name tz.i569.cn; #填写绑定证书的域名ssl_certificate /etc/nginx/myconf…

蓝桥杯备战——8.DS1302时钟芯片

1.分析原理图 由上图可以看到,芯片的时钟引脚SCK接到了P17,数据输出输入引脚IO接到P23,复位引脚RST接到P13。 2.查阅DS1302芯片手册 具体细节还需自行翻阅手册,我只截出重点部分 总结:数据在上升沿写出,下降沿读入,…

赚钱的雏形,是跑通最小闭环!

没赚钱本事,就专心打磨武器! 很多人有一个错误的认知,就是做项目一定是新的,一定是有创新在里面,但其实赚钱的开始,一定是复制现有的项目。 现有的项目,可以确保他有市场,能够跑通&a…

Ps:段落面板

Ps菜单:窗口/段落 Window/Paragraph Ps菜单:文字/面板/段落面板 Type/Panels/Paragraph Panel 对于“点文本”,默认一行为一个段落。每按一次回车键,就多出一个段落。 对于“段落文本”,一段可能有多行,具体…

【Vite+Vue3+TS】基于Vite+Vue3+TypeScript+ESLint+Prettier+Stylelint搭建项目(亲测超详细)

目 录 项目搭建步骤确定node版本使用Vite创建Vue3项目规范目录结构配置环境修改Vite配置文件集成路由工具Vue Router集成状态管理工具Pinia集成CSS预编译器Sassvite-plugin-svg-icons图标组件集成UI框架Element Plus集成HTTP 请求工具 Axios 项目代码规范集成ESLint配置集成Pre…

动手学深度学习(一)深度学习介绍1

目录 一、引言 1.日常生活中的机器学习: 2.机器学习中的关键组件: 2.1 数据: 2.2 模型: 2.3 目标函数: 2.4 优化算法: 3. 各种机器学习问题: 3.1 监督学习: 3.1.1 回归&…

qemu + vscode图形化调试linux kernel

一、背景 使用命令行连接gdb 在调试时,虽然可以通过tui enable 显示源码,但还是存在设置断点麻烦(需要对着源码设置),terminal显示代码不方便,不利于我们学习;另外在gdb 下p命令显示结构体内容…

Vue Router 简介

聚沙成塔每天进步一点点 本文内容 ⭐ 专栏简介Vue Router 简介主要特性:安装和基本用法: ⭐ 写在最后 ⭐ 专栏简介 Vue学习之旅的奇妙世界 欢迎大家来到 Vue 技能树参考资料专栏!创建这个专栏的初衷是为了帮助大家更好地应对 Vue.js 技能树的…

CSRF靶场练习

简述:CSRF漏洞实际很少;条件限制很多;局限性很大;实验仅供参考,熟悉csrf概念和攻击原理即可 Pikachu靶场 CSRF GET 登录用户vince的账户可以看到用户的相关信息; 点击修改个人信息,发现数据包…

基于springboot+layui实现的旅游信息管理系统源码+数据库,可以查看旅游路线、飞机火车的班次

travel 介绍 旅游信息管理系统,系统架构:springbootlayui 系统截图 ) 技术选型 技术版本说明Spring Boot2.1.6MVC核心框架Spring Security oauth22.1.5认证和授权框架MyBatis3.5.0ORM框架MyBatisPlus3.1.0基于mybatis,使用lambda表达式的…

TensorFlow2实战-系列教程6:迁移学习实战

🧡💛💚TensorFlow2实战-系列教程 总目录 有任何问题欢迎在下面留言 本篇文章的代码运行界面均在Jupyter Notebook中进行 本篇文章配套的代码资源已经上传 1、迁移学习 用已经训练好模型的权重参数当做自己任务的模型权重初始化一般全连接层需…

读AI3.0笔记08_自然语言

1. 人工智能研究的惯用的套路 1.1. 定义一个在细分领域中比较有用的任务 1.2. 收集一个大型数据集来测试机器在该任务上的性能 1.3. 对人类在该数据集上完成任务的能力进行一个有限的度量 1.4. 建立一场竞赛使得人工智能系统可以在该数据集上互相竞争 1.5. 直到最终达到或…

内存储器之只读存储器(ROM),随机存取存储器(RAM)和Cache详解

内存储器 计算机中的存储器分为内存和外存两大类。 内存的存取速度快而容量相对较小,它与CPU直接相连,用来存放等待CPU运行的程序和处理的数据;外存的速度较慢而容量相对很大,它与CPU并不直接连接,用于永久性地存放计…

网络安全04-sql注入靶场第一关

目录 一、环境准备 1.1我们进入第一关也如图: ​编辑 二、正式开始第一关讲述 2.1很明显它让我们在标签上输入一个ID,那我们就输入在链接后面加?id1 ​编辑 2.2链接后面加个单引号()查看返回的内容,127.0.0.1/sqli/less-1/?id1,id1 …

Unity 迭代器模式(实例详解)

文章目录 简介**实例1:遍历数组****实例2:自定义迭代器类****实例3:异步加载资源****实例4:游戏关卡序列****实例5:无限生成敌人** 简介 在Unity中,虽然不直接使用迭代器模式的原始定义(即设计…

PDF标准详解(一)——PDF文档结构

已经很久没有写博客记录自己学到的一些东西了。但是在过去一年的时间中自己确实又学到了一些东西。一直攒着没有系统化成一篇篇的文章,所以今年的博客打算也是以去年学到的一系列内容为主。通过之前Vim系列教程的启发,我发现还是写一些系列文章对自己的帮…

Springmvc-@RequestBody

SpringBoot-2.7.12 请求的body参数无法转换,服务端没有报错信息打印,而是响应的状态码是400 PostMapping("/static/user") public User userInfo(RequestBody(required false) User user){user.setAge(19);return user; }PostMapping("…

05 Redis之Benchmark+简单动态字符串SDS+集合的底层实现

3.8 Benchmark Redis安装完毕后会自动安装一个redis-benchmark测试工具,其是一个压力测试工具,用于测试 Redis 的性能。 src目录下可找到该工具 通过 redis-benchmark –help 命令可以查看到其用法 3.8.1 测试1 3.9 简单动态字符串SDS 无论是 Redis …