quadraticBezierToの座標【Flutter】

Question

-ClipPathにて、quadraticBezierToの座標について教えて頂きたいです。

二次ベジエ曲線(quadraticBezier)とのことで、数学的な難しい座標なのでしょうか...?

---

自分でもいじってみたのですが、
どの座標が何を表しているのかイマイチ把握できませんでした????

お時間あるときにご返信いただければ、幸いです。

class MyClipper extends CustomClipper<Path>{
  @override
  Path getClip(Size size) {
    final path = Path();
    path.lineTo(0, size.height - 80);
    path.quadraticBezierTo(size.width/2, size.height, size.width, size.height -80);
//    path.quadraticBezierTo(xi, y1, x2, y2)
    path.lineTo(size.width, 0);
    path.close();
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}

Answer 1

引用:
『Adds a quadratic bezier segment that curves from the current point to the given point (x2,y2), using the control point (x1,y1).』

????quadraticBezierToは、"現在点"から"与えられる点"までのカーブ。

手順
-moveTo, lineToなどで、"現在点"まで移動。
-(x2,y2)は"与えられる点"
-つまり、"現在点"と(x2,y2)の間にカーブができる。

-(x1,y1)はコントロールポイント
(http://math.hws.edu/graphicsbook/demos/c2/quadratic-bezier.html)

(公式サイト:　https://api.flutter.dev/flutter/dart-ui/Path/quadraticBezierTo.html)

Answer 2

https://api.flutter.dev/flutter/dart-ui/Path/quadraticBezierTo.html
ここに記載してある通り、1つめのx,y座標が終着点、2つめのx,y座標がコントロールポイントです。

下記の黒丸がquadraticBezierToの終着点で、青い四角がコントロールポイントを表しています。
http://math.hws.edu/graphicsbook/demos/c2/quadratic-bezier.html