How Can I See The Style Applied to a Widget?

888 views Asked by At

Is there a way to see what style is being applied to a widget? In website development there is the Style tab in the Chrome Dev Tools which shows what style is applied and how this cascades and this is really useful to debug the page.

Is there a similar feature in Flutter?

1

There are 1 answers

0
Ozan Taskiran On BEST ANSWER

A small example to see information about fontSize, color etc. for a Text widget:

Open the Widget Inspector and switch to the Widet Details Tree Open the Widget Inspector and switch to the Widet Details Tree

Hover over dependencies to see the DefaultTextStyle. For this to work, you must have enabled "hover inspection" in the Inspector Settings (top right gear icon). enter image description here

Hover over dependencies to see the DefaultTextStyle

Open the DefaultTextStyle to see the style element, which has all the information. Open the DefaultTextStyle to see the style element, which has all the information