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選項卡不在本書范圍。