Flutter的Hot Reload是如何做到的

众所周知,在Flutter 应用的Debug模式下,当我们开启【Hot Reload】功能时,不需要在重启应用即可看到最新的代码效果。这种类似于RN、Weex和小程序的热加载功能是如何做到的呢,它背后的原理是什么?

基本使用方法

Flutter的热重载(hot reload)功能可以帮助您在无需重新启动应用的情况下快速、轻松地进行测试、构建用户界面、添加功能以及修复错误。 通过将更新后的源代码文件注入正在运行的Dart虚拟机(VM)中来实现热重载。在虚拟机使用新的的字段和函数更新类后,Flutter框架会自动重新构建widget树,以便您快速查看更改的效果。

我们编写一个应用,运行应用程序,然后修改 Flutter APP 工程里的 Dart 代码,然后点击【Hot Reload】按钮开启热重载,如下图所示。
在这里插入图片描述
VS Code 开启 Hot Reload 。
Flutter的Hot Reload是如何做到的_第1张图片
当我们修改Dart代码,点击保存的时候,就会看到界面已经发生了变化,如下图。
Flutter的Hot Reload是如何做到的_第2张图片

总结一下,在Flutter中使用热重载需要经过以下几个步骤:

  1. 连接真机或虚拟机,运行 Flutter APP,且必须以 Debug 模式启动。因为只有 Debug 模式才能使用 Hot Reload。
  2. 修改 Flutter APP 工程里的 Dart 代码,但并不是所有 Dart 代码的修改都可以使用 Hot Reload,有一些情况下Hot Reload 并不能生效,只能使用 Hot Restart(重新启动)。
  3. 使用快捷键 ctrl+s(Windows、Linux)或者 cm

你可能感兴趣的:(Flutter,Flutter入门与实战)