feat: add StacBackdropFilter widget #274
Conversation
|
|
There was a problem hiding this comment.
Thanks a lot for this contribution @manav-m 🎉 I have few suggestions please check them out.
| final imageFilter = StacImageFilterParser.parse(model.filter); | ||
| if (imageFilter == null) { | ||
| return child; | ||
| } | ||
|
|
||
| return BackdropFilter( | ||
| filter: imageFilter, | ||
| child: child, | ||
| ); | ||
| } |
There was a problem hiding this comment.
We should throw error when imageFilter is missing. So, ideally we should remove the null check for imageFilter.
| Widget parse(BuildContext context, StacBackdropFilter model) { | ||
| final child = Stac.fromJson(model.child, context) ?? const SizedBox(); | ||
|
|
||
| if (!model.enabled) { |
There was a problem hiding this comment.
model.enabled should be passed in BackdropFilter
There was a problem hiding this comment.
@manav-m I think this one is not resolved. Can you please check?
packages/stac/lib/src/parsers/widgets/stac_backdrop_filter/stac_backdrop_filter.dart
Show resolved
Hide resolved
| @Default(StacDouble(10.0)) StacDouble sigmaX, | ||
| StacDouble? sigmaY, | ||
| @Default(StacDouble(1.0)) StacDouble radiusX, | ||
| StacDouble? radiusY, |
There was a problem hiding this comment.
Default value for sigma and radius should be 0.
There was a problem hiding this comment.
A 0 sigma/radius value would basically make the filter do nothing by default. Shouldn't the filter do a basic blur by default?
There was a problem hiding this comment.
We usually set the default value of the Flutter framework to keep Stac consistent with Flutter.
| @freezed | ||
| abstract class StacImageFilter with _$StacImageFilter { | ||
| const factory StacImageFilter({ | ||
| required String type, |
There was a problem hiding this comment.
Can we please turn type into an enum?
| import 'package:stac/src/parsers/widgets/stac_image_filter/stac_image_filter.dart'; | ||
|
|
||
| class StacImageFilterParser { | ||
| static ImageFilter? parse(StacImageFilter? filter) { |
There was a problem hiding this comment.
Can we please turn this into an extension method?
Removed null check for image filter Passing model.enabled to backdrop filter Added support for Blendmode Property Set default value for sigma and radius to 0 Filter type is now an enum Turn the stac_image_filter_parser into an extension method
Convert the parse function into a getter
| |-----------|------------------------|--------------------------------------------------------------------------------------------| | ||
| | `filter` | `Map<String, dynamic>` | The image filter to apply to the existing painted content before painting the child. | | ||
| | `child` | `Map<String, dynamic>?`| The widget to paint after applying the filter to the existing painted content. | | ||
| | `enabled` | `bool` | Whether the filter should be applied. When false, the child is drawn without a filter. Defaults to `true`. | |
There was a problem hiding this comment.
Can we please add the blendMode in docs?
Adds the StacBackdropFilter widget, which applies a filter to the background of its child widget. The backdrop filter is applied to everything behind the child widget that is within the same layer.
Examples
✅ Example: Basic blur filter
{ "type": "clipRRect", "borderRadius": { "all": 16 }, "child": { "type": "sizedBox", "height": 200, "width": 300, "child": { "type": "stack", "fit": "expand", "children": [ { "type": "container", "decoration": { "image": { "src": "https://images.pexels.com/photos/1323550/pexels-photo-1323550.jpeg", "fit": "cover" } } }, { "type": "backdropFilter", "filter": { "type": "blur", "sigmaX": 15.0, "sigmaY": 15.0 }, "child": { "type": "container", "decoration": { "color": "#80FFFFFF" } } } ] } } }More examples can be found in the docs at docs/widgets/backdrop_filter.md
Related Issues
Closes #269
Type of Change