Can I draw a custom box shadow in Flutter using Canvas in a CustomPaint?

Question

It\'s clear how to draw a shadow with an elevation property but what if I want to have the shadow centered for example?

Answer 1

To draw shadow on CustomPaint you can use painter.

CustomPaint(
  painter: BoxShadowPainter(),
  child: ClipPath(
  clipper: MyClipper(), //my CustomClipper
  child: Container(), // my widgets inside
)));

check my answer here

Answer 2

Found a solution:

I can simply go into the source code for the BoxShadow widget and apply the path properties they used to my own paths.

Here's the source code.

Here's the code that I used to create a shadow for a custom path (rather than a circle or rectangle with a border radius) that allowed me to create a custom shadow rather than using the elevation preset.

    canvas.drawPath(
       Path()
          ..addRect(
              Rect.fromPoints(Offset(-15, -15), Offset(size.width+15, size.height+15)))
          ..addOval(
              Rect.fromPoints(Offset(0, 0), Offset(size.width, size.height)))
          ..fillType = PathFillType.evenOdd,
        Paint() 
        ..color= Colors.black.withAlpha(shadowAlpha)
        ..maskFilter = MaskFilter.blur(BlurStyle.normal, convertRadiusToSigma(3))
    );

    static double convertRadiusToSigma(double radius) {
        return radius * 0.57735 + 0.5;
    }