《HarmonyOS NEXT应用开发实践（视频教学版）（编程与应用开发丛书）》(王树生)【摘要 书评 试读】- 京东图书

目录

2.1  开发环境搭建

2.1.1  下载DevEco Studio

2.1.2  安装DevEco Studio

2.2  创 建 工 程

2.3  DevEco Studio界面简介

2.1  开发环境搭建

俗话说：“工欲善其事，必先利其器。”为了顺利进行HarmonyOS应用开发，需要事先准备好DevEco Studio开发工具，即HarmonyOS的一站式集成开发环境。

2.1.1  下载DevEco Studio

下面以在Windows系统中安装 DevEco Studio为例，介绍如何下载、安装和配置开发环境。

为保证DevEco Studio正常运行，建议计算机配置满足如下要求：

• 操作系统：Windows 10 64位。
• 内存：8GB及以上。
• 硬盘：100GB及以上。
• 分辨率：1280×800像素及以上。

具体操作步骤如下：

   打开 DevEco Studio官方网站，在页面上单击“立即下载”按钮，如图2-1所示。

   单击“立即下载”按钮，会跳转到华为账号登录界面，如图2-2所示。

   注册账号后继续下载，DevEco Studio提供了Windows版本和Mac版本，可以根据操作系统选择对应的版本进行下载。笔者下载的是DevEco Studio 5.0.5 Release版本，版本信息如图2-3所示。

图2-1  HarmonyOS官方网页

图2-2  华为账号登录页面

图2-3  DevEco Studio下载版本

2.1.2  安装DevEco Studio

   解压下载的DevEco Studio压缩包，启动exe安装程序，进入安装欢迎界面，如图2-4所示。

   单击“下一步”按钮，进入“选择安装位置”界面，选择安装路径，这里根据自己的喜好选择即可，需要约10GB的存储空间，如图2-5所示。

   单击“下一步”按钮，进入“安装选项”界在，勾选“DevEco Studio”和“添加‘bin’文件夹到PATH”复选框，如图2-6所示。

 图2-4  DevEco Studio安装欢迎界面 

                                                  图2-5  DevEco Studio安装路径

   单击“下一步”按钮，进入“选择开始菜单目录”，选择开始菜单文件夹，这里保持默认即可，如图2-7所示。

                      图2-6  DevEco Studio安装选项                              

  图2-7  DevEco Studio选择开始菜单目录

   单击“下一步”按钮，进入安装程序结束界面，勾选“运行DevEco Studio”复选框，并单击“完成”按钮，如图2-8所示。

图2-8  DevEco Studio安装完成

至此，DevEco Studio安装完成。

2.2  创 建 工 程

使用DevEco Studio创建工程（Project，本书翻译为工程）的步骤如下：

   创建工程。若是首次打开DevEco Studio，则在欢迎页面单击Create Project创建工程，如图2-9所示。如果已经打开了一个工程，则在菜单栏中依次单击File→New→Create Project来创建一个新工程。

图2-9  DevEco Studio首页

   选择Application项目。进入选择能力模板页面，在页面左侧选择Application，然后在页面右侧选择Empty Ability，再单击Next按钮，如图2-10所示。

图2-10  DevEco Studio创建项目

   配置工程。进入工程配置页，如图2-11所示。

图2-11  工程配置信息

在工程配置页中，几个关键配置项的详细信息说明如下：

• Project name：开发者可以自行设置的项目名称。
• Bundle name：包名称，默认情况下应用ID也会使用该名称，应用发布时对应的ID需要保持   一致。
• Save location：工程保存路径，建议用户自行设置相应位置。
• Compile SDK：编译的API版本，这里默认选择5.0.5。
• Model name：模型名称，保持默认即可。

   成功创建工程框架。配置完成后，单击Finish按钮，DevEco Studio会自动生成示例代码和相关资源，完成工程框架的创建。

2.3  DevEco Studio界面简介

进入DevEco Studio（IDE）后，我们首先了解一下它的基础界面。整个界面大致上可以分为4个部分，分别是工程目录区、代码编辑区、预览区以及通知栏，如图2-12所示。

1. 工程目录区

界面左侧为工程目录区，后续章节将会详细介绍。

2. 代码编辑区

界面中间的是代码编辑区，可以在这里修改代码以及切换显示的文件。通过按住Ctrl键并滚动鼠标滚轮，可以实现界面的放大与缩小。

图2-12  DevEco Studio界面介绍

图2-13  竖屏预览

3. 预览区

单击DevEco Studio右侧的Previewer按钮，可以预览相应文件的UI展示效果，如图2-13所示。

预览器提供了一些基本功能，包括旋转屏幕、切换显示设备及多设备预览等。单击旋转按钮，可以切换竖屏和横屏的显示效果，如图2-14所示。也可以单击图2-14中框选的按钮，[f2] 切换显示的设备类型。弹出框内会显示Available Profiles，即可用的设备类型，如图2-15所示。如单击Foldable切换设备，也可以单击旋转按钮切换Foldable的横竖屏显示模式。

             

图2-14  横屏预览 

          

 图2-15  切换设备

打开 Muti-profile preview 开关，可以实现多个尺寸设备的实时预览，如图2-16所示。

单击预览器右上角的组件预览按钮，可以进入组件预览界面，如图2-17所示。

  

图2-16  多尺寸设备预览

 图2-17  组件预览模式

在组件预览模式下可以预览当前组件对应的代码块。在预览界面中单击相应组件，则在代码文件中会框选对应的组件代码，右侧组件树则展示当前组件的基本属性，如图2-18所示。

图2-18  组件属性预览

4. 通知栏

在编辑器底部有一行工具，单击这些工具，对应的信息将在通知栏中显示。其中常用的有：Run用于显示项目运行时的信息；Build显示程序编译情况；Problems用于显示当前工程错误与提醒信息；Terminal是命令行终端，在这里执行命令行操作；PreviewerLog用于输出预览器日志输出；Log用于输出模拟器和真机运行时的日志。在后续使用中会陆续接触这些工具。