back
loading skill details...
Adds interactive widget previews to the project using the previews.dart system. Use when creating new UI components or updating existing screens to ensure…
Previewing Flutter Widgets Contents Preview Guidelines Handling Limitations Workflows Examples Preview Guidelines Use the Flutter Widget Previewer to render widgets in real-time, isolated from the full application context. Target Elements: Apply the @Preview annotation to top-level functions, static methods within a class, or public widget constructors/factories that have no required arguments and return a Widget or WidgetBuilder. Imports: Always import package:flutter/widget_previews.dart to access the preview annotations. Custom Annotations: Extend the Preview class to create custom annotations that inject common properties (e.g., themes, wrappers) across multiple widgets. Multiple Configurations: Apply multiple @Preview annotations to a single target to generate multiple preview instances. Alternatively, extend MultiPreview to encapsulate common multi-preview configurations. Runtime Transformations: Override the transform() method in custom Preview or MultiPreview classes to modify preview configurations dynamically at runtime (e.g., generating names based on dynamic values, which is impossible in a const context). Handling Limitations
don't have the plugin yet? install it then click "run inline in claude" again.