找回密码
 立即注册
首页 业界区 业界 flutter openharmony项目新手从0到1的保姆级教程 ...

flutter openharmony项目新手从0到1的保姆级教程

巩芷琪 前天 10:30
 flutter oh项目新手从0到1的保姆级教程

前言

很多的坑踩过才知道,保姆级教程就是无脑跟随作者的教程走,不要有自己的想法。请注意,如果你读到这个文章,请必须严格按照文档顺序操作,保证一把过,如果有个人思想跳过部分章节,请自己排坑。
请准备好鸿蒙5的设备,必须要鸿蒙5及以上系统,其低于这个版本的系统就别看本文章了
 
一、配置开发环境

1、下载DevEco Studio编辑器

默认安装,不要有自己的想法,默认就行
 
2、配置ohpm 和 hvigorw 环境变量

将ohpm、hvigorw添加到系统 PATH
  1. C:\Program Files\Huawei\DevEco Studio\tools\ohpm\bin
  2. C:\Program Files\Huawei\DevEco Studio\tools\hvigor\bin
复制代码
测试命令:
  1. 全局cmd操作:ohpm -v
  2. 项目里面操作:hvigorw -v
复制代码
 
3、配置HOS_SDK_HOME环境变量

在用户、系统环境变量里面,新增一个HOS_SDK_HOME变量,地址为你编辑器里面的地址,并且创建2个文件夹,分别为:openharmony、hmscore
[img=531.7333333333333,252.32965879265092]https://img2024.cnblogs.com/blog/2407038/202510/2407038-20251017094049979-971068489.png[/img]

[img=531.733,339.44]https://img2024.cnblogs.com/blog/2407038/202510/2407038-20251017094049934-357781322.png[/img]

4、配置DEVECO_SDK_HOME环境变量

在“系统变量”中点击“新建”,添加以下内容:
  1. 变量名:DEVECO_SDK_HOME
  2. 变量值:DevEco SDK的安装路径(例如:C:\Huawei\DevEcoStudio\SDK)
复制代码
 
5、配置HDC环境变量

安装好DevEco Studio之后,能在setting中看到下载的路径,可能会自动配置hdc变量,配置你下载的api的地址,但是可以自己配置或检查,将hdc配置到系统path中,请到自己的目录中查看,我的路径为
  1. C:\Users\yang\AppData\Local\OpenHarmony\Sdk\15\toolchains
复制代码
[img=554.133,262.959]https://img2024.cnblogs.com/blog/2407038/202510/2407038-20251017094049979-971068489.png[/img]

 
6、配置node环境变量

用到了node,在DevEco中有提供安装,直接在系统变量的path中添加
  1. C:\Program Files\Huawei\DevEco Studio\tools\node
复制代码
 
7、下载oh的flutter

本次开发使用的3.27.4版本,用git clone下载,不要下载zip,不要有自己的想法,请遵循保姆级教程逻辑
  1. git clone -b oh-3.27.4-dev https://gitcode.com/openharmony-tpc/flutter_flutter.git
复制代码
 
8、下载android studio

官网下载,这一步是拿来写代码用的编辑器,如果不想使用可以用其他编辑器
 
二、初始化环境

1、  初始化flutter

在下载好的oh flutter中,打开命令行,运行命令
  1. flutter doctor
复制代码
这一步会自动下载初始化该版本的dart
2、  打开DevEco Studio

这一步可能会自动下载部分环境初始化
3、  打开Android studio

这一步可能会自动下载部分环境初始化
 
三、  设备连接

1、  设备准备

请准备好鸿蒙5的设备,必须要鸿蒙5及以上系统,其低于这个版本的系统就别装了
2、  启用开发者选项和 USB 调试

开发者选项开启请在关于本机中,软件版本连续点击5次开启
确保已开启:
设置 → 系统和更新 → 开发人员选项
开启 "USB调试"
开启 "仅充电模式下允许调试"(如果有)
3、设备连接

HDC(HarmonyOS Device Connector)是鸿蒙的设备连接工具,类似于 Android 的 ADB。命令行中输入hdc list targets 如果设备已连接,会显示设备的序列号。如果没有连接,则不会显示任何设备。
 
四、项目初始化

3、  在Android studio中创建或打开flutter项目

创建好项目之后输入
  1. flutter pub get
复制代码
下载基础依赖
 
4、  初始化oh环境

在项目的控制台中输入 
  1. flutter create --platforms=ohos .
复制代码
为现有项目添加 HarmonyOS 平台
 
5、  验证项目

控制台输入
  1. flutter devices
复制代码
查看项目支持的平台
6、  引入依赖

特殊的oh包需要单独的引入,注意:如果包为全平台通用包,不需要单独引入包来源,即包中没有Android、iOS等平台文件夹,如果存在就要单独创建,开鸿这边给出的方式为
  1.   flutter_zxing:
  2.     git:
  3.       url: "https://gitcode.com/openharmony-sig/fluttertpc_flutter_zxing.git"
复制代码
  1.   device_info_plus:       # 设备型号、系统版本
  2.     git:
  3.       url: "https://gitcode.com/openharmony-sig/flutter_plus_plugins.git"
  4.       path: "packages/device_info_plus/device_info_plus"
复制代码
  1. [/code][size=3]7、  启动项目[/size]
  2. 输入命令,这2个命令都会启动,第一个命令会自动寻找oh设备
  3. [code]flutter run
复制代码
  1. flutter run -d ohos
复制代码
启动过程如果有多个设备会让选择使用哪个设备进行启动,或者Android studio直接点击运行,会自动识别并编译启动oh环境
 
四、  底层开发

如果你的包没有支持oh,但是你又想使用支持
1、  下载包

github中下载你的包,并且打开项目
2、  创建oh平台

在项目中创建oh平台
3、  oh支持

在原有的逻辑中,编码oh平台逻辑
4、  引入包

在项目初始化段落中,依赖引入章节方式引入
 
五、异常问题

1、提示路径映射问题

Make sure the srcPath in the hvigorconfig.ts file of the project is a relative path.
请查看这个issues:
https://gitcode.com/openharmony-tpc/flutter_packages/issues/621

来源:程序园用户自行投稿发布,如果侵权,请联系站长删除
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!

相关推荐

您需要登录后才可以回帖 登录 | 立即注册