-
-
Save coman3/e631fd55cd9cdf9bd4efe8ecfdbb85a7 to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart'; | |
@immutable | |
class ClipShadowPath extends StatelessWidget { | |
final Shadow shadow; | |
final CustomClipper<Path> clipper; | |
final Widget child; | |
ClipShadowPath({ | |
@required this.shadow, | |
@required this.clipper, | |
@required this.child, | |
}); | |
@override | |
Widget build(BuildContext context) { | |
return CustomPaint( | |
painter: _ClipShadowShadowPainter( | |
clipper: this.clipper, | |
shadow: this.shadow, | |
), | |
child: ClipPath(child: child, clipper: this.clipper), | |
); | |
} | |
} | |
class _ClipShadowShadowPainter extends CustomPainter { | |
final Shadow shadow; | |
final CustomClipper<Path> clipper; | |
_ClipShadowShadowPainter({@required this.shadow, @required this.clipper}); | |
@override | |
void paint(Canvas canvas, Size size) { | |
var paint = shadow.toPaint(); | |
var clipPath = clipper.getClip(size).shift(shadow.offset); | |
canvas.drawPath(clipPath, paint); | |
} | |
@override | |
bool shouldRepaint(CustomPainter oldDelegate) { | |
return true; | |
} | |
} |
How would I add the color property here? I want to change the color of the shadow
@sameerkhan24 You can just set the color on the shadow you pass to the ClipShadowPath (using the example provided by OP):
Widget buildBodyWidget(BuildContext context) {
return ClipShadowPath(
clipper: _MyCustomClipper(),
shadow: Shadow(
blurRadius: 5,
color: Colors.red, // This line was added
),
child: Scaffold(
body: Center(child: Text("Test"),),
),
);
}
Can this be extended to add only a border?
@geisterfurz007 please share with me the code for achieving
Shadow on the _MyCustomClipper
@madhubansahani I am unsure what you are missing. _MyCustomClipper
is a class that extends from CustomClipper
, the rest are Flutter built-ins. shadow
defines the look of the shadow you want and the child is the child you want to apply your custom shadow to.
@coman3 Have you added any license for this snippet of code? Thank you :)
@coman3 Have you added any license for this snippet of code? Thank you :)
Feel free to use this under the MIT license. ☺
@coman3 I've just been fighting a bug in my application, where the child of my ClipShadowPath
is a stateful widget, but it was loosing its state every time its parent's build
method was called. After an hour fighting it, I finally understood that it was caused by the CustomPaint
widget defining its key as a UniqueKey()
.
Someone already posted a similar situation before, and as you noted yourself, there are probably others this happens to:
Note that using
key: UniqueKey()
broke myAnimatedOpacity
(and likely other animations) that was used as a child ofClipShadowPath
.Thanks for the tip, I'm sure someone was fighting with this in the past since that change 👍
Could you remove the key definition from your gist? I'm not sure what benefit it brings really, but it certainly causes many other developers to loose time figuring out why their application is buggy.
@coman3 I've just been fighting a bug in my application, where the child of my
ClipShadowPath
is a stateful widget, but it was loosing its state every time its parent'sbuild
method was called. After an hour fighting it, I finally understood that it was caused by theCustomPaint
widget defining its key as aUniqueKey()
.Someone already posted a similar situation before, and as you noted yourself, there are probably others this happens to:
Note that using
key: UniqueKey()
broke myAnimatedOpacity
(and likely other animations) that was used as a child ofClipShadowPath
.Thanks for the tip, I'm sure someone was fighting with this in the past since that change 👍
Could you remove the key definition from your gist? I'm not sure what benefit it brings really, but it certainly causes many other developers to loose time figuring out why their application is buggy.
Sorry if this wasted ya time, I've removed it :)
Interesting, what would _MyCustomClipper be? I'm looking to add a shadow to a ClipRRect