Question

有什么方法可以检查模拟器中的Flutter App元素吗？我使用的是VS代码而不是android studio，我想从运行的模拟器中检查元素。

Answer 1

如Danny Tuppeny（VScode中的dart插件的创建者）montined：

Flutter检查器目前在VS Code中不可用

您可以按照此issue进行更多更新

更新：

在VS Code的新Dart Code插件中，有类似的内容 look here

Answer 2

从版本2.24.0开始， DevTools 选项是调试和检查的新功能。

>Dart: Open DevTools

Answer 3

要检查Flutter项目中的小部件，请执行以下操作：

1-打开命令面板（Ctrl + Shift + P（在macOS上为Cmd + Shift + P））。
2-选择Flutter：Inspect Widget命令，然后按Enter。
3-点击模拟器中的任何小部件。
4-请参阅小部件树。
5-祝你好运。

Answer 4

在运行应用程序时，出现热重载后，请在终端中按“ i”。也有一些其他功能。要找到它，请在终端中按“ h”。

Answer 5

我使用快捷方式：Ctrl + Alt + D（使用Ubuntu + VSCode）。

别忘了该应用程序必须已经在调试模式下运行，如Evandro所述。

Answer 6

实际上，当您在运行h后在终端中输入flutter run时，您会得到所有这些东西；

Flutter run key commands.
r Hot reload. ???
R Hot restart.
h Repeat this help message.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).
s Save a screenshot to flutter.png.
b Toggle the platform brightness setting (dark and light mode).          (debugBrightnessOverride)
w Dump widget hierarchy to the console.                                             (debugDumpApp)
t Dump rendering tree to the console.                                        (debugDumpRenderTree)
L Dump layer tree to the console.                                             (debugDumpLayerTree)
S Dump accessibility tree in traversal order.                                 (debugDumpSemantics)
U Dump accessibility tree in inverse hit test order.                          (debugDumpSemantics)
i Toggle widget inspector.                                (WidgetsApp.showWidgetInspectorOverride)
I Toggle oversized image inversion ?️.                               (debugInvertOversizedImages)
p Toggle the display of construction lines.                                (debugPaintSizeEnabled)
o Simulate different operating systems.                                    (defaultTargetPlatform)
z Toggle elevation checker.
g Run source code generators.
M Write SkSL shaders to a unique file in the project directory.
v Launch DevTools.
P Toggle performance overlay.                                  (WidgetsApp.showPerformanceOverlay)
a Toggle timeline events for all widget build methods.                  (debugProfileWidgetBuilds)

要直接向浏览器打开 DevTool ，您可以输入v。

结果将是这样；

open this link

Visual Studio代码中的Flutter Inspector

6 个答案: