鸿蒙Flutter实战:08-如何调试代码

简介: 本文介绍了鸿蒙Flutter项目的开发环境搭建、配置、日志查看及调试方法。首先按照指南搭建开发环境,安装IDE插件;接着配置vscode的launch.json文件;通过IDE调试控制台或命令行查看日志;提供两种调试Flutter的方式,包括IDE直接运行和使用DevEco;最后介绍ArkTs和Webview的调试方法。

1.环境搭建

参考文章鸿蒙Flutter实战:01-搭建开发环境搭建好开发环境。IDE 安装好 DevEco 和 VsCode/Android Studio。

2.配置

如果是 vscode, 可以在 .vscode/launch.json 文件中,增加以下配置

   {
   
      "name": "ohos-app (attach mode)",
      "cwd": "packages/apps/ohos_app",
      "request": "attach",
      "type": "dart",
    },
    {
   
      "name": "ohos_app",
      "cwd": "packages/apps/ohos_app",
      "request": "launch",
      "type": "dart"
    },

添加成功后,会在运行和调度的 Tab 栏目中,出现启动的选项。这里添加了两个配置,一个是 Attach 模式,一个是普通的运行模式。

3.查看日志

查看日志,可以在运行Flutter处的IDE调试控制台查看 Flutter 项目日志,可以使用 hdc hilog 命令或DevEco 查看系统日志。

4.调试 Flutter

主要有两种调试方案。

方案一

在IDE 中直接运行 Flutter 项目,IDE 可选择 Andriod Studio 或者 VsCode,在调试栏点击 Debug 运行。

方案二

适应DecEco运行鸿蒙项目,注意需要打开的是ohos鸿蒙目录代码,待IDE分析结束后,点击运行。

当app在鸿蒙设备上启动成功后,立即在 Vscode 中调出 Command Pallet,找到 Flutter Attach ,将 Flutter 调试器连接至宿主机

然后就是增加断点,使用hot reload 重新加载 Flutter,调试项目代码。

调试 ArkTs

需要使用 DevEcho 打开项目,点击运行旁边的 Debug Entry 按钮,开始程序调试。

调试 Webview

参考文章 鸿蒙Flutter实战:04-如何使用DevTools调试Webview进行 Webview 调试。

目录
相关文章
|
3月前
|
安全 开发工具 数据安全/隐私保护
HarmonyOS应用安全全攻略:从系统到代码的全面防护
本文全面解析HarmonyOS应用安全开发,涵盖系统到代码的防护策略。首先介绍HarmonyOS三层安全体系:系统安全层、开发工具层与应用生态层。接着详解设备与数据安全等级划分,提供分级加密实战代码,包括文件读写与HUKS高级加密案例。最后总结开发最佳实践,强调数据分类、最小权限、加密常态及传输安全保障,助你构建更安全的应用。保护用户数据不仅是功能需求,更是开发者责任!
186 0
|
2月前
|
前端开发 Java 开发者
SpringBoot 3 + Flutter3 实战低代码运营管理
Spring Boot 3 与 Flutter 3 强强联合,助力现代 Web 与移动应用开发。Spring Boot 3 提升后端开发效率,支持最新 Java 特性;Flutter 3 实现跨平台高性能 UI,热重载加速前端迭代。两者结合打造高效、可扩展的应用开发新体验。
108 0
|
3月前
|
定位技术 UED
70. [HarmonyOS NEXT 实战案例九] 旅游景点网格布局(下)
在上一篇教程中,我们学习了如何使用GridRow和GridCol组件实现基本的旅游景点网格布局。本篇教程将在此基础上,深入探讨如何优化布局、添加交互功能,以及实现更多高级特性,打造一个功能完善的旅游景点应用。
86 1
|
3月前
|
容器
69.[HarmonyOS NEXT 实战案例九] 旅游景点网格布局(上)
本教程将详细讲解如何使用HarmonyOS NEXT中的GridRow和GridCol组件实现旅游景点网格布局。通过网格布局,我们可以以美观、规整的方式展示各种旅游景点信息,为用户提供良好的浏览体验。
80 1
|
3月前
|
UED
68.[HarmonyOS NEXT 实战案例八] 电影票务网格布局(下)
在上一篇教程中,我们学习了如何使用GridRow和GridCol组件实现基本的电影票务网格布局。本篇教程将在此基础上,深入探讨如何优化布局、添加交互功能,以及实现更多高级特性,打造一个功能完善的电影票务应用。
73 1
|
3月前
|
开发者 容器
67.[HarmonyOS NEXT 实战案例八] 电影票务网格布局(上)
在移动应用开发中,电影票务应用是一个常见的场景,用户可以通过应用查看正在热映的电影信息,并进行选座购票等操作。本教程将详细讲解如何使用HarmonyOS NEXT的GridRow和GridCol组件实现电影票务应用中的电影列表网格布局,帮助开发者掌握网格布局的基本用法和实现技巧。
88 1
|
3月前
|
UED
66.[HarmonyOS NEXT 实战案例七] 健身课程网格布局(下)
在上一篇教程中,我们学习了如何使用GridRow和GridCol组件实现基本的健身课程网格布局。本篇教程将在此基础上,深入探讨如何优化布局、添加交互功能,以及实现更多高级特性,打造一个功能完善的健身课程应用。
78 1
|
3月前
|
设计模式 UED
65. [HarmonyOS NEXT 实战案例七] 健身课程网格布局(上)
本教程将介绍如何使用HarmonyOS NEXT的GridRow和GridCol组件实现健身课程的网格布局展示。健身课程网格布局是一种常见的UI设计模式,适用于展示各种健身课程信息,包括课程名称、教练信息、课程时长、难度级别等。通过网格布局,用户可以快速浏览多个课程,并根据自己的需求选择合适的课程。
79 1
|
3月前
64.[HarmonyOS NEXT 实战案例六] 餐饮菜单网格布局(下)
在上一篇教程中,我们学习了如何使用GridRow和GridCol组件实现基本的餐饮菜单网格布局。本篇教程将在此基础上,深入探讨如何优化布局、添加交互功能,以及实现更多高级特性,打造一个功能完善的餐饮菜单应用。
84 0
|
3月前
|
存储
63.[HarmonyOS NEXT 实战案例六] 餐饮菜单网格布局(上)
在移动应用开发中,餐饮类应用的菜单展示是一个常见的需求。一个设计良好的菜单布局不仅能够清晰地展示菜品信息,还能提升用户的点餐体验。本教程将详细讲解如何使用HarmonyOS NEXT的GridRow和GridCol组件实现一个美观实用的餐饮菜单网格布局。
76 0