鸿蒙Flutter实战:12-使用模拟器开发调试

田楷
• 阅读 103

鸿蒙 Flutter 实战:使用模拟器开发调试

前提

开发电脑需为M系列芯片 (ARM架构) 的 Mac 电脑

目前 Flutter 鸿蒙开发,无法使用 X86 架构的模拟器,只能使用 ARM 架构的模拟器**

创建项目

等开发环境搭建成功,使用 flutter create 命令创建项目

新项目

flutter create --platforms ohos ohos_app

旧项目增加鸿蒙平台支持

flutter create --platforms ohos .

签名

使用 DevEco 打开上面项目中的 ohos 目录,也就是我们的鸿蒙项目目录

打开 File -> Project Structure..., 点击 Siging Configs, 勾选 Automatically generate signature,

点击 Sign In, 登录华为账号,点击右下角 Apply, OK, 完成签名。

观察控制台会输出 Process finished with exit code 0的提示

> hvigor WARN: The current module 'ohos' has dependency which is not installed at its oh-package.json5.
> hvigor Finished :entry:init... after 1 ms
> hvigor Finished ::init... after 1 ms

Process finished with exit code 0

创建模拟器

1.打开 DevEco 中的 Device Manager(可以从右上角的运行按钮左侧下拉找到)

鸿蒙Flutter实战:12-使用模拟器开发调试

2.在右下角点击 + New Emulator, 弹出选择模拟器窗口,如果镜像还没有下载,方框处会出现下载按钮,先点击下载,下载完成后点击 Next 创建模拟器,再点击 Previous 创建成功

鸿蒙Flutter实战:12-使用模拟器开发调试

3.回到模拟器列表窗口,列表中出现了新建的模拟器,点击运行按钮, 模拟器运行成功。

运动 Flutter 项目

Vscode中右下角应当出现模拟器的设备,行如 127.0.0.1:5555(ohos-arm64), 如果没有出现参考注意事项中的说明 2 操作。

回到 Vscode 中的Flutter 项目,像普通的 flutter 项目那行,点击运行按钮。

注意事项

1. Flutter 运行 App,打包安装成功, 运行闪退 从以下方面检查:

1.1 如果是 X86电脑架构的模拟器,尝试删除 main.dart 中的 FloatingActionButton 1.2 如果 Flutter SDK 使用的 ohos-3.22, 尝试关闭 impeller 渲染方式,打开或创建文件 ohos/entry/src/main/resources/rawfile/buildinfo.json5, 增加以下配置

{
   "string": [
      {
         "name": "enable_impeller",
         "value": "true"
      }
   ]
}

2.VSCode 中模拟器设备不显示

2.1 尝试使用 Deveco 打开项目的 ohos 目录(即鸿蒙项目文件),等待初始化分析成功 2.2 尝试重启 VSCode

3.使用 fvm 时,项目目录下 flutter --version 显示不正确,不是 ohos 版本

以次按以下的方式进行逐个尝试,直至成功。

3.1 尝试在 vscode 的命令行中运行 fvm use custom_3.22.0, 待命令创建 .vscode/setting.json 文件并在其中增加类似这样的配置

{
  "dart.flutterSdkPath": ".fvm/versions/custom_3.22.0"
}

项目根目录中出现 .fvm/version/custom_3.22.0 这样的目录文件,项目根目录出现 .fvmrc 文件,其内容类似如下

{
  "flutter": "custom_3.22.0"
}

3.2 尝试重启 VsCode 的命令行,或者重启整个 VsCode,待重新打开 VSCode 命令行以后,flutter --version 出现这样的输出

Flutter 3.22.0-ohos • channel oh-3.22.0 • https://gitee.com/harmonycommando_flutter/flutter.git
Framework • revision 85630b0330 (13 天前) • 2024-10-26 02:39:47 +0000
Engine • revision f6344b75dc
Tools • Dart 3.4.0 • DevTools 2.34.1

3.3 关闭全局 flutter 配置

~/.zshrc~/.bash_profile中,删除或者注释掉类似这样的配置,重启命令行/VSCode

#export PATH="/Users/zacksleo/flutter/bin:$PATH"
点赞
收藏
评论区
推荐文章
小天 小天
10个月前
鸿蒙系统开发
有用的网站鸿蒙官网:鸿蒙系统开发者:华为开发者:在线体验:Gitee:JSAPI:开发环境搭建(DevEcoStudio)DevEcoStudio是面向全场景多设备,提供一站式的分布式应用开发平台下载地址:安装确保有网络环境安装模拟器安装菜单ToolsDe
田楷 田楷
1个月前
鸿蒙Flutter实战:01-搭建开发环境
鸿蒙Flutter实战:01搭建开发环境
田楷 田楷
1个月前
鸿蒙Flutter实战:02-Windows环境搭建踩坑指南
鸿蒙Flutter实战:02Windows环境搭建踩坑指南环境搭建1.下载FlutterSDK,配置环境变量鸿蒙FlutterSDK需要在。目前建议下载dev分支代码。需要配置以下用户变量注意鸿蒙开发需要安装Java和配置相关变量bashfluttersd
田楷 田楷
1个月前
鸿蒙Flutter实战:04-如何使用DevTools调试Webview
鸿蒙Flutter如何使用DevTools调试Webview在《鸿蒙Flutter开发中集成Webview》,介绍了如果在Flutter中集成Webview.本文则为Webview的调试方法。配置WebviewCustomView.ets文件中,在生命周期
田楷 田楷
1个月前
鸿蒙Flutter实战:06-使用ArkTs开发Flutter鸿蒙插件
使用ArkTs开发Flutter鸿蒙平台插件本文讲述如何开发一个Flutter鸿蒙插件,如何实现Flutter与鸿蒙的混合开发,以及双端消息通信。Flutter侧,编写MethodChanneldartconstMethodChannelmethodCha
田楷 田楷
1个月前
鸿蒙Flutter实战:07-混合开发
鸿蒙Flutter实战:混合开发鸿蒙Flutter混合开发主要有两种形式。1.基于har将fluttermodule打包成har包,在原生鸿蒙项目中,以har包的方式引入。其优点是主项目开发者可以不关注Flutter实现,不需要安装配置Flutter开发环
田楷 田楷
1个月前
鸿蒙Flutter实战:08-如何调试代码
鸿蒙Flutter实战:如何调试代码1.环境搭建参考文章搭建好开发环境。IDE安装好DevEco和VsCode/AndroidStudio。2.配置如果是vscode,可以在.vscode/launch.json文件中,增加以下配置json"name":"
田楷 田楷
1个月前
鸿蒙Flutter实战:09-现有Flutter项目支持鸿蒙
鸿蒙Flutter实战:现有Flutter项目支持鸿蒙背景原来使用Flutter开发的项目,需要适配鸿蒙。环境搭建见文章[鸿蒙Flutter适配指南],搭建开发环境,使用fvm管理多版本SDK。模块化原有项目保持模块化,拆分为apps/common/com
田楷 田楷
1个月前
鸿蒙Flutter实战:10-常见问题集合
鸿蒙Flutter实战:10常见问题集合1.学习路径应该是怎样的,需要掌握哪些技术才具备鸿蒙Flutter开发能力1.1学习和掌握Flutter开发技术,这块需要在Flutter社区学历1.2学习鸿蒙基础概念和知识,推荐学习,,,2.MatePad应用适配
田楷 田楷
1个月前
鸿蒙Taro实战:01-搭建开发环境
鸿蒙Taro实战:01搭建开发环境配置鸿蒙环境下载安装DevEco配置IDE打开Prefreences,OpenHarmonySDK,勾选APIVersion12创建鸿蒙项目打开DevEco,点击右上角CreateProject,在Application处