我正在尝试使用核心图形来编程方式来绘制iOS 7风格的图标“圆形”形状.我不是问如何画一个圆角的矩形.一个圆形是一个超椭圆:
它与常规圆角矩形略有不同:
这是is readily available的准确公式.但是,我无法弄清楚如何使用CGPath,更不用说填写它,并且可以轻松地调整大小.所有这一切与公式完全一致.任何想法?
解决方法
来自维基百科:
Superellipse
For n = 1/2,in particular,each of the four arcs is a Quadratic Bézier curve defined by the two axes; as a result,each arc is a segment of a parabola.
那么为什么不试图用Bezier曲线逼近Squircle?两个曲线(Bezier和Squircle)都由参数方程定义.
UIBezierPath Class有方法:addCurveToPoint:controlPoint1:controlPoint2:
Appends a cubic Bézier curve to the receiver’s path.
注意:使用addQuadCurveToPoint:controlPoint:方法使测试结果更差.
我使用这种方法,结果发生了什么事情:
红线 – 圆角矩形,蓝线 – 四边形Bezier曲线的矩形
如果这个结果有兴趣 – 下面的绘图代码.
注意:要获得更精确的匹配,可以要求改变四角点的坐标(现在它们对应于其中刻有图形的矩形的角度)的贝塞尔曲线.
CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSaveGState(context); //set rect size for draw float rectSize = 275.; CGRect rectangle = CGRectMake(CGRectGetMidX(rect) - rectSize/2,CGRectGetMidY(rect) - rectSize/2,rectSize,rectSize); //Rounded rectangle CGContextSetStrokeColorWithColor(context,[UIColor redColor].CGColor); UIBezierPath* roundedPath = [UIBezierPath bezierPathWithRoundedRect:rectangle cornerRadius:rectSize/4.7]; [roundedPath stroke]; //Rectangle from Fours Bezier Curves CGContextSetStrokeColorWithColor(context,[UIColor blueColor].CGColor); UIBezierPath *bezierCurvePath = [UIBezierPath bezierPath]; //set coner points CGPoint topLPoint = CGPointMake(CGRectGetMinX(rectangle),CGRectGetMinY(rectangle)); CGPoint topRPoint = CGPointMake(CGRectGetMaxX(rectangle),CGRectGetMinY(rectangle)); CGPoint botLPoint = CGPointMake(CGRectGetMinX(rectangle),CGRectGetMaxY(rectangle)); CGPoint botRPoint = CGPointMake(CGRectGetMaxX(rectangle),CGRectGetMaxY(rectangle)); //set start-end points CGPoint midRPoint = CGPointMake(CGRectGetMaxX(rectangle),CGRectGetMidY(rectangle)); CGPoint botMPoint = CGPointMake(CGRectGetMidX(rectangle),CGRectGetMaxY(rectangle)); CGPoint topMPoint = CGPointMake(CGRectGetMidX(rectangle),CGRectGetMinY(rectangle)); CGPoint midLPoint = CGPointMake(CGRectGetMinX(rectangle),CGRectGetMidY(rectangle)); //Four Bezier Curve [bezierCurvePath moveToPoint:midLPoint]; [bezierCurvePath addCurveToPoint:topMPoint controlPoint1:topLPoint controlPoint2:topLPoint]; [bezierCurvePath moveToPoint:midLPoint]; [bezierCurvePath addCurveToPoint:botMPoint controlPoint1:botLPoint controlPoint2:botLPoint]; [bezierCurvePath moveToPoint:midRPoint]; [bezierCurvePath addCurveToPoint:topMPoint controlPoint1:topRPoint controlPoint2:topRPoint]; [bezierCurvePath moveToPoint:midRPoint]; [bezierCurvePath addCurveToPoint:botMPoint controlPoint1:botRPoint controlPoint2:botRPoint]; [bezierCurvePath stroke]; CGContextRestoreGState(context);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。