How to add border radius to CustomPaint Widget Flutter

Question

I'm trying to add border radius to my custom shaped widget using Custom Paint, but I don't know how to add rounded edges to the custom shape.

I achieved the shape, but not the rounded edges.

Below is the code for the custom paint. How can I add border radius to the edges.

``

class RPSCustomPainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Paint paint0 = Paint()
      ..color = const Color.fromARGB(255, 33, 150, 243)
      ..style = PaintingStyle.stroke
      ..strokeWidth = 1.4900000095367432;

    Path path0 = Path();
    path0.moveTo(3.03, 197.85);
    path0.quadraticBezierTo(0.87, 47.28, 1.9, 1.36);
    path0.lineTo(207.0, 2.0);
    path0.lineTo(170.24, 197.9);
    path0.quadraticBezierTo(16.26, 197.13, 3.03, 197.85);
    canvas.drawPath(path0, paint0);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return true;
  }
}

``

Answer 1

you can use drawRRect() to draw the border radius for corners of your shape.

canvas.drawRRect(RRect.fromRectAndRadius(Rect.fromLTWH(size.width / 2 - gap - smallMarkWidth - 15,gap * 8,gap + 70,gap * 5,),Radius.circular(15.0)),backgroundPaint);