如何在Visual Studio Code中使用Flutter的Widget Inspector？

Question

如何在VSCode和现在的introduced中使用Flutter Widget检查器enabled？从IDE或终端调试应用程序时，单击iOS模拟器中的任何小部件都不会发生任何反应。我从Google找不到关于VSCode的任何信息。

我在MacOS Sierra上。

Answer 1

从v2.24开始，用于VS Code的Dart扩展已与Dart DevTools集成。与stt106提到的原始 Inspect Widget 命令相比，它具有更好的检查器功能。

在调试会话处于活动状态的情况下，打开命令面板并找到DevTools命令。

首次运行此程序时，系统可能会提示您激活或升级。

DevTools随后将在浏览器中启动并连接到调试会话。

有关Dart DevTools in the DevTools docs功能的更多信息。

Answer 2

调试时，运行命令 Flutter：检查窗口小部件，然后单击UI /窗口小部件，它将自动将您引导至生成窗口小部件的代码。它仅在调试模式下有效，该命令在调试中加载应用程序后才可用。