计算addCurveToPoint控制点

我正在使用CoreGraphics绘制一个圆角矩形，我熟悉用CG API准备绘制圆角矩形，但我不想使用它，因为矩形不是完全一致的圆角矩形，它的一部分将是一个圆角矩形，其他部分将是一组连接的路径，例如，左上角和右上角将是一个圆角矩形边，但底边是一组连接的贝塞尔路径。计算addCurveToPoint控制点

我的问题是，如果我想绘制整个形状为贝塞尔路径，我应该如何计算addCurveToPoint中的控制点的角落？我知道点的半径和坐标（也基于半径）。

（UPDATE）

I have a sample code, I am trying to understand the math behind it: 

UIBezierPath * rectangle = [UIBezierPath bezierPath]; 
[rectangle moveToPoint:CGPointMake(0, 8)]; 
[rectangle addCurveToPoint:CGPointMake(8.01, 0) controlPoint1:CGPointMake(0, 3.58) controlPoint2:CGPointMake(3.59, 0)]; 
[rectangle addLineToPoint:CGPointMake(208, 0)]; 
[rectangle addCurveToPoint:CGPointMake(224, 16.01) controlPoint1:CGPointMake(216.84, 0) controlPoint2:CGPointMake(224, 7.16)]; 
[rectangle addLineToPoint:CGPointMake(224, 175)]; 
[rectangle addCurveToPoint:CGPointMake(192, 207) controlPoint1:CGPointMake(224, 192.67) controlPoint2:CGPointMake(209.67, 207)]; 
[rectangle addLineToPoint:CGPointMake(64, 207)]; 
[rectangle addCurveToPoint:CGPointMake(0, 142.99) controlPoint1:CGPointMake(28.65, 207) controlPoint2:CGPointMake(0, 178.35)]; 
[rectangle addLineToPoint:CGPointMake(0, 8)]; 
[rectangle closePath];

拐角半径是8，16，32和64为左上，右上，右下和左下

由于

来源

2016-09-19 Nader

我假设你想为圆角增加一个90度弧。使用addArc而不是addCurveToPoint。

在斯威夫特3：

var path = UIBezierPath() 

... 

let center = CGPoint(x: topLeft.x + width - radius, y: topLeft.y) 
path.addArc(withCenter: center, radius: radius, startAngle: CGFloat.pi, endAngle: CGFloat.pi * CGFloat(1.5), clockwise: true)

当然，你的参数会有所不同。

更新

基于您的代码，它应该是这样的：

UIBezierPath * rectangle = [UIBezierPath bezierPath]; 
[rectangle moveToPoint:CGPointMake(0, 8)]; 
[rectangle addArcWithCenter:CGPointMake(8, 8) radius:8 startAngle:M_PI endAngle:M_PI*1.5 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(208, 0)]; 
[rectangle addArcWithCenter:CGPointMake(208, 16) radius:16 startAngle:M_PI*1.5 endAngle:0 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(224, 175)]; 
[rectangle addArcWithCenter:CGPointMake(208, 175) radius:32 startAngle:0 endAngle:M_PI*0.5 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(64, 207)]; 
[rectangle addArcWithCenter:CGPointMake(64, 175) radius:64 startAngle:M_PI*0.5 endAngle:M_PI clockwise:YES]; 
[rectangle closePath];

来源

2016-09-19 08:07:31 Codo

谢谢，我已经有我想要的示例代码，但我不知道它背后的数学： – Nader

@Nader看到我上面的更新...'center'是弧的中心，即它从矩形拐角偏移半径。如果您有兴趣了解弧如何近似为贝塞尔曲线，请参见[使用立方贝塞尔曲线逼近圆弧]（http://hansmuller-flex.blogspot.ch/2011/04/approximating-circular-arc-与-cubic.html）。 – Codo

谢谢！这真的工作，但我不得不稍微修改它:) – Nader

基于@Codo答案，这是最终的解决方案：

UIBezierPath * rectangle = [UIBezierPath bezierPath]; 
[rectangle moveToPoint:CGPointMake(0, 8)]; 
[rectangle addArcWithCenter:CGPointMake(8, 8) radius:8 startAngle:M_PI endAngle:M_PI*1.5 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(208, 0)]; 
[rectangle addArcWithCenter:CGPointMake(208, 16) radius:16 startAngle:M_PI*1.5 endAngle:0 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(224, 175)]; 
[rectangle addArcWithCenter:CGPointMake(192, 175) radius:32 startAngle:0 endAngle:M_PI*0.5 clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(64, 207)]; 
[rectangle addArcWithCenter:CGPointMake(64, 143) radius:64 startAngle:M_PI*0.5 endAngle:M_PI clockwise:YES]; 
[rectangle addLineToPoint:CGPointMake(0, 8)]; 
[rectangle closePath];

来源

2016-09-19 11:04:33 Nader

我还没有发现你和我的代码之间的区别呢。你可以帮我吗？ – Codo

计算addCurveToPoint控制点

回答

相关问题