Flutter 混合开发调试

针对Flutter开发的同学来说,大部分的应用还是Native + Flutter的混合开发,所以每次改完Flutter代码,运行整个项目无疑是很费时间的。所以Flutter官方也给我们提供了混合调试的方案【在混合开发模式下进行调试】,这里以Android Studio为例做一个梳理:

方式一:

1、点击Android Studio上面的"Flutter Attach"按钮:
2、点击后出现如下提示,等待Flutter module的连接,也就是说等待你进入项目中的待调试Flutter页面:
3、进入Flutter页面后,如出现如下图红框的提示,表示已经正常连接成功:
4、后续就可以通过修改Flutter的代码,直接点击"Hot Reload"及"Hot Restart",便可以查看修改效果:
  • Hot Reload:如果只修改build()方法中的内容,则点击该按钮即可,页面不会整体重载。
  • Hot Restart:如果在build()方法之外修改内容,如在initState() / getArguments() / didChangeDependencies()中修改内容,一般情况下需要点击该按钮,进行页面重载。

方式二、

如果方式一对你无法生效时,可以尝试如下方式:

1、LogCat 过滤 The Dart VM,并进入Flutter页面,此时会出现如下地址【不同设备地址不一样】:
复制代码
http://127.0.0.1:38722/QaEvP_Rv2DQ=/
2、在你的futter module的终端下输入指令:
复制代码
flutter attach --debug-uri=http://127.0.0.1:38722/QaEvP_Rv2DQ=/ --verbose

其中http地址便是你上面获取到的地址。

当出现如图所示界面,就表示attach成功了:

3、修改你的Flutter代码,然后就可以通过输入 rR 进行查看效果了,如输入R时的效果:

flutter页面重新加载,便会看到修改后效果。

相关推荐
Utopia^19 小时前
Flutter 框架跨平台鸿蒙开发 - 旅行预算管家
flutter·华为·harmonyos
李李李勃谦20 小时前
Flutter 框架跨平台鸿蒙开发 - 星空识别助手
flutter·华为·harmonyos
李李李勃谦20 小时前
Flutter 框架跨平台鸿蒙开发 - 本地生活服务预约
flutter·华为·生活·harmonyos
2301_8227032020 小时前
开源鸿蒙跨平台Flutter开发:幼儿疫苗全生命周期追踪系统:基于 Flutter 的免疫接种档案与状态机设计
算法·flutter·华为·开源·harmonyos·鸿蒙
2301_8227032021 小时前
鸿蒙flutter三方库实战——教育与学习平台:Flutter Markdown
学习·算法·flutter·华为·harmonyos·鸿蒙
2301_822703201 天前
开源鸿蒙跨平台Flutter开发:蛋白质序列特征提取:氨基酸组成与理化性质计算
flutter·华为·开源·harmonyos·鸿蒙
钛态1 天前
Flutter 三方库 ethereum_addresses 的鸿蒙化适配指南 - 掌控区块链地址资产、精密校验治理实战、鸿蒙级 Web3 专家
flutter·harmonyos·鸿蒙·openharmony·ethereum_addresses
提子拌饭1331 天前
开源鸿蒙跨平台Flutter开发:中小学百米跑信息记录表:基于 Flutter 的高精计时与运动学曲线引擎
flutter·华为·开源·harmonyos
SY.ZHOU1 天前
移动端架构体系(四):View层的组织与调用方案
flutter·ios·架构·系统架构·安卓
2301_822703201 天前
光影进度条:鸿蒙Flutter实现动态光影效果的进度条
算法·flutter·华为·信息可视化·开源·harmonyos