How to made CustomPaint like this in flutter
401
Path@arcToPoint is useful for drawing circle/oval segments.
For example, for a circle with radius equal to half rect's height:
final w = size.width;
final h = size.height;
final r = h / 2;
final path = Path();
path.moveTo(0, 0);
path.lineTo(w / 2 - r, 0);
path.arcToPoint(
Offset(w / 2 + r, 0),
radius: Radius.circular(r),
clockwise: false,
);
path.lineTo(w, 0);
path.lineTo(w, h);
path.lineTo(0, h);
path.close();
Author by
Filip
Updated on December 21, 2022Comments
-
Filip over 1 year
I know it's not the best way but I really can't do this. How to made something like this. I'm suck in geometry. I try to do this with cubicTo but I cen't get this effect :/.
Can someone help me. Below is part of my code.
var sw = size.width; var sh = size.height; var path = Path(); path.cubicTo(sw/2, 0, sw/4, 0, 2*sw/4, 2*sh/4); path.cubicTo(2*sw/3, 2*sh/3, sw/3, 0, sw, 0); path.cubicTo(0, 0, 0, 0, sw, 0); path.lineTo(sw, sh); path.lineTo(0, sh); path.close();