Skip to content

Add support to define widget preview and see it in the IDE when developing #115704

@mboron

Description

@mboron

Use case

It is difficult to quickly find out what widget contains the dart file when opening it in the IDE. A developer has to read the code and try to guess what the widget looks like and whether this is the widget he searches for. Because of that, it is hard to get oriented in a project with a large code base or when joining a project created by someone else, or simply when you don't remember widget names by heart. One has to run the app and search for a particular widget e.g. based on strings visible in the app UI.
Also, a developer has to run the app when developing even a simple widget.

Proposal

I would like to see a widget preview(s) when opening a dart file. Also, I would like to be able to define some example data for the widget preview, or even more preview options like font scale.
That would allow me to develop widgets without a need to run the app and orient quickly in the project.

In general, it would be useful to have the preview functionality similar to:
• Android Compose annotations - @Preview/@PreviewParameter
- https://developer.android.com/jetpack/compose/tooling#preview
• or Swift UI PreviewProvider

Btw: it seems that there is starting one project that is similar to what I aim for - https://pub.dev/packages/idea_widget_preview

Metadata

Metadata

Labels

P1High-priority issues at the top of the work lista: devtoolsDevTools related - suite of performance and debugging toolsc: new featureNothing broken; request for a new capabilityc: proposalA detailed proposal for a change to Flutterteam-toolOwned by Flutter Tool teamtriaged-toolTriaged by Flutter Tool team

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions