1.3.1　三个实用工具

Structure与Flutter Outline：AS的Flutter Outline（下图右侧）可以显示出一个文件的结构图，这和Structure（下图左侧）的功能基本一致。但从视觉上来看，Flutter Outline更符合Flutter的风格，而且通过顶部的按键可以进行一些操作，非常方便。

Type Hierarchy：查看源码或者分析项目时，面对一个类的庞大家族体系，往往手足无措。这时可以将光标停在类上或选中它，通过Type Hierarchy查看类的继承族谱（默认快捷键为Ctrl+H）。这对全局的把握非常有意义，下图所示为一个Widget体系。

Flutter Inspector：如果拿到一个复杂的界面，这对界面的布局结构分析是很有帮助的。如果在开发中发现布局上的困惑或错误，可以使用这个工具查看并分析排错。

使用“debug Paint”功能可以查看界面中每个小部件的线框图（如下左图）。通过在控制台中输入“p”或从AndroidStudio中的Flutter Inspector中选择“Toggle debug Paint”实现效果（如下右图）。

除此之外，还可以用它查看某一个组件的信息及显示的区域，对于文字，可以显示基线与底边线。用Flutter Inspector的这些功能来辅助开发，必当有如神助。关于RenderTree选项卡，这里暂时不介绍，Day 7中将进行讲解，Performance选项卡不在本书范围。