保姆级教程带你实现HarmonyOS手语猜一猜元服务（二）

由于文章篇幅较长，共分为了三篇发布：

保姆级教程带你实现HarmonyOS手语猜一猜元服务（一）
保姆级教程带你实现HarmonyOS手语猜一猜元服务（二）
保姆级教程带你实现HarmonyOS手语猜一猜元服务（三）

🚀二、开发环境搭建

🔎1.DevEco Studio

DevEco Studio是一款专门为鸿蒙（HarmonyOS）系统开发而设计的综合性开发工具IDE，开发者可以利用该工具进行鸿蒙应用的设计、开发、调试和发布。DevEco Studio集成了代码编辑器、模拟器、调试工具、图形用户界面设计器和应用管理工具等多个功能，方便开发者进行鸿蒙应用的开发与管理。

DevEco Studio支持多语言开发，包括Java、ArkTS、JavaScript等，同时还支持多种开发模式和框架。此外，它还支持多平台开发，包括手机、平板、智能手表、电视等不同终端设备。

DevEco Studio下载地址：HUAWEI DevEco Studio和SDK下载和升级 | HarmonyOS开发者

安装完成之后界面：

🔎2.配置环境变量

本文以window系统为例，具体操作步骤如下：

1、通过“设置 > 系统 > 系统信息 > 高级系统设置”进入“系统属性”页面的“高级”页签，点击“环境变量”

2、在“系统变量”中添加 HDC_SERVER_PORT和OHOS_HDC_SERVER_PORT 两个变量，变量值设置为未被占用的端口，例如7036和7037

3、在用户或者系统的path变量中，添加HDC工具的路径。

HDC工具路径为：HarmonyOS SDK安装目录/hmscore/{版本号}/toolchains。例如：C:\Users\XXXXX\AppData\Local\Huawei\Sdk\hmscore\3.1.0\toolchains

环境变量配置完成，重启DevEco Studio。

🔎3.诊断开发环境

1、打开项目，从欢迎页进入：底部菜单选择“Help > Diagnose Development Environment”

2、待自动检查完成。如果有检查未通过的项目，请根据检查项的描述和修复建议进行处理

🔎4.下载SDK

1、打开项目，从欢迎页进入：底部菜单选择“Configure > Settings”

🚀三、创建元服务项目

🔎1.创建元服务项目的步骤

1、登录AppGallery Connect，点击“我的应用”。

首次进入需要签协议

2、在“HarmonyOS”页签，“类型”选择“元服务”，可以查看创建的元服务。

🔎2.选择模板和配置项目属性

1、打开DevEco Studio，菜单选择“File > New > Create Project”，创建一个新工程。

2、选择“Atomic Service”，选择“Empty Ability”模板，点击“Next”。

3、配置工程基本信息。

Project name：设置“myProject”。
Bundle name：本样例以“com.huawei.myproject”为例。
Save location：选择工程存放路径。
Compile SDK：支持API 4~9，本样例选择“API 9”。
Model：应用支持的模式，API Version 4~8只支持FA模式。
Enable Super Visual：是否使用低代码开发模式，本样例不打开此开关。
Language：开发语言。
Device type：该工程模板支持的设备类型。本样例以手机设备为例。

点击“Finish”，等待工程创建完成，即可进行代码编写。

🔎3.编写代码和调试运行

1、点击右侧的Previewer工具，预览页面效果。

2、新建details.ets页面

details.ets页面

@Entry
@Component
struct Details {build() {//Flex容器组件Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {//Text组件Text('我是跳转页面').fontSize(60).fontWeight(500)}//容器整体宽高.width('100%').height('100%')}
}

main_pages.json页面

{"src": ["pages/Index","pages/details"]
}

3、添加跳转按钮实现页面跳转

index.ets页面

import router from '@ohos.router'
@Entry
@Component
struct Index {@State message: string = '愚公搬代码'build() {//Flex容器组件Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {//Text组件Text('愚公搬代码').fontSize(60).fontWeight(500)//Button组件Button('跳转下一页').fontSize(40).fontWeight(500).width(280).height(60)//点击Button实现页面跳转.onClick(() => {console.info("跳转开始")router.pushUrl({url: 'pages/details' // 目标url}, (err) => {if (err) {console.error(`Invoke pushUrl failed, code is ${err.code}, message is ${err.message}`);return;}console.info('Invoke pushUrl succeeded.');});})}//容器整体宽高.width('100%').height('100%')}
}