'Flutter Custom Clipper Radius Octogone

I'm trying to round off the shapes of my clipper but it's impossible. I tried with the path.arcToPoint property but I think I don't really understand how it works to add radius on path. Only with arcToPoint property ?

I put my Clipper class and the code to call the clipper here :

ClipPath(
  clipper: Clipper(points: 8),
  child: Container(
    height: 150,
    width: 150,
    decoration: BoxDecoration(
      color: Color.red,
    ),
    child: Center(child: Text('1'),
  ),
);
class Clipper extends CustomClipper<Path> {

Clipper({this.points = 8});

/// The number of points of the star
 final int points;

@override
Path getClip(Size size) {
 double width = size.width;
 double halfWidth = width / 2;

 double bigRadius = halfWidth;

 double radius = halfWidth / 1.25;

 double degreesPerStep = _degToRad(360 / points);

 double halfDegreesPerStep = degreesPerStep / 2;

 var path = Path();

 double max = 2 * math.pi;

 path.moveTo(width, halfWidth);

 for (double step = 0; step < max; step += degreesPerStep) {
   path.lineTo(halfWidth + bigRadius * math.cos(step), halfWidth + bigRadius * math.sin(step));
   path.arcToPoint(
      Offset(
        halfWidth + bigRadius * math.cos(step),
        halfWidth + bigRadius * math.sin(step),
      ),
      radius: const Radius.circular(50));
  path.lineTo(halfWidth + radius * math.cos(step + halfDegreesPerStep), halfWidth + radius * math.sin(step + halfDegreesPerStep));
  path.arcToPoint(
      Offset(
        halfWidth + radius * math.cos(step + halfDegreesPerStep),
        halfWidth + radius * math.sin(step + halfDegreesPerStep),
      ),
      radius: const Radius.circular(50));
 }

 path.close();
 return path;
}

double _degToRad(num deg) => deg * (math.pi / 180.0);

@override
bool shouldReclip(CustomClipper<Path> oldClipper) {
  Clipper oldie = oldClipper as Clipper;
  return points != oldie.points;
}
}

Thanks



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source