如何画一个有1个圆角的矩形？

Question

请问如何画一个圆角矩形并填充颜色？

我尝试使用arcTo方法和以下代码：

this.bgGraphics.beginFill(0xFFCC00, 1);
this.bgGraphics.moveTo(0, 0);
this.bgGraphics.lineTo(45, 0);
this.bgGraphics.arcTo(45, 0, 60, 15, 15);
this.bgGraphics.lineTo(60, 60);
this.bgGraphics.lineTo(0, 60);
this.bgGraphics.endFill();

即我正在绘制一个 60 x 60 矩形，然后尝试使用arcTofrom point 45, 0to45, 15和 radius 15。

但它不是右上角的圆角，而是将其切掉：

Answer 1

方法arcTo()有点混乱。(x1,y1) 坐标不是曲线的起点。可以将其想象为贝塞尔曲线手柄的点。为了获得您想要的弧线，您需要沿 x 轴直线拉动贝塞尔曲线手柄。所以你的方法实际上应该是这样的：

this.bgGraphics.arcTo(60, 0, 60, 15, 15);