在 Flutter 里有几种调试方式。
- 断点调试。
- debugger 调试。
- rendering 调试。
- 日志调试。
- 运行状态调试。
- 真机调试。
断点调试
在 Flutter 进行断点调试非常简单，只需要在 Vscode 上打上一个断点，按 F5 就会停在断点处。通过左边的调试栏，观察断点处的变量以及栈堆情况。
image.png
debugger调试
除了打断点，也可以使用 debugger API 的方式。
import 'dart:developer';
void someFunction(double offset) {
debugger(when: offset > 30.0, message: 'offset 大于 30 时，中断');
// ...
}
这段代码表明，当 offset 这个变量的值大于 30.0 时中断运行，并输出 message 的内容。debugger 代码只会在开发阶段运行。
rendering 调试
rendering 即开启布局线，当打开 rendering 时，会在界面上看到一些布局线，以便于修复布局效果。
import 'package:flutter/rendering.dart';
void main() {
debugPaintSizeEnabled = !true;
runApp(new MyApp());
}
打开之后看到的效果。
image.png
日志调试
日志调试，直接使用 print 输出内容即可，在 AS、Vscode 里的控制台/调试控制台都可以看到。
为了方便，定义一个 Debug 类。
class Debug {
static log(String tag, String text) {
print('[$tag] $text');
}
static info(String tag, String text) {
print('[$tag] $text');
}
static success(String tag, String text) {
print('[$tag] $text');
}
static error(String tag, String text) {
print('[$tag] $text');
}
}
运行状态调试
在使用命令：flutter run 时，会有一个 Observatory URL 地址提供（一般为：http://127.0.0.1:8108/），那就是运行状态调试，打开之后可以看到应用的 GC、VM 方面的信息。注意，如果使用 F5 启动，则没有这个功能。
真机调试
开启真机调试的步骤：
- 打开 开发者选项 还有 USB 调试。
- 使用 USB 将手机连接电脑，若手机出现提示，授权电脑访问手机。
- 在命令执行 flutter devices 确认连接电脑的设备。
-
然后可通过执行 flutter run 运行我们的 app。
在手机上开启 USB 调试模式。
image.png
