基本步骤就是：
1、获取当前绘图上下文
2、设置笔触颜色
3、设置笔触宽度
4、设置填充颜色
5、然后就开始绘制了（当然也是最复杂的地方了）
举个🌰
class CircleImage: UIView {
override func drawRect(rect: CGRect) {
// Drawing code
super.drawRect(rect)
let ctx = UIGraphicsGetCurrentContext()
// 设置笔触颜色
CGContextSetStrokeColorWithColor(ctx, UIColor.blackColor().CGColor)
// 设置笔触宽度
CGContextSetLineWidth(ctx, 2)
// 设置填充色
CGContextSetFillColorWithColor(ctx, UIColor.purpleColor().CGColor)
CGContextSetLineJoin(ctx, .Round)
CGContextSetLineCap(ctx, .Round)
guard ctx != nil else {
return
}
// drawLine(ctx!)
drawCircle(ctx!)
}
假设现在要绘制一个圆，下面我们来实现这个drawCirlce
func drawCircle(ctx: CGContextRef) {
// 第一种方式 在点（100,100）出绘制一个半径为50的圆弧，角度从0到2pi，已顺时针方向，这个最容易理解，不解释。
CGContextAddArc(ctx, 100, 100, 50, 0, CGFloat(M_PI), 1)
CGContextFillPath(ctx)
CGContextStrokePath(ctx) // 该代码无效了
// 第二种方式 ，设置起始点在（100,100），然后在绘制4段弧，分别是上左，上右，下右，下左，凑在一起实际上就是一个圆。这个就一批人放弃了
// 因此需要解释一下，我们只需要在UIKit坐标系中，（注意是UIKit坐标系）绘制出(100,100),(100,50),(150,20)这三个点，
// 然后依次连接起来，显然就形成了一个举行的左上角形状了，
// 然后想象一个半径为50的圆从矩形的中心慢慢移动到矩形的左上角，等到拟合停止，上左段圆弧就出来了。
// 依次。。4段圆弧都出来就是一个圆了
// 那么问题来了，如果半径改为25，会出现什么图形，自己脑补，不会脑补就修改跑一下代码好吗？
CGContextMoveToPoint(ctx, 100, 100);
CGContextAddArcToPoint(ctx, 100, 50, 150, 50, 50);
CGContextAddArcToPoint(ctx, 200, 50, 200, 100, 50)
CGContextAddArcToPoint(ctx, 200, 150, 150, 150, 50)
CGContextAddArcToPoint(ctx, 100, 150, 100, 100, 50)
CGContextStrokePath(ctx);
// CGContextFillPath(ctx)
// 第三种方式，放一个矩形区域在那里，你在里面塞一个最大的椭圆出来，当矩形宽高相等，显然，就是一个正圆了
CGContextAddEllipseInRect(ctx, CGRectMake(200, 50 + 25, 50, 50))
CGContextStrokePath(ctx);
// 第四种方式，三阶贝塞尔曲线抱歉，我并没有画出一个圆来，数学能力有限，实际上 绘制出来的是一个椭圆而已
CGContextMoveToPoint(ctx, 200, 200);
CGContextAddCurveToPoint(ctx, 200, 100, 300, 100, 300, 200)
CGContextAddCurveToPoint(ctx, 300, 300, 200, 300, 200, 200)
CGContextStrokePath(ctx);
// 第五种方式，二阶贝塞尔曲线，抱歉，我依然没有画出一个圆来，数学能力有限，实际上 绘制出来的是一个橄榄球
CGContextMoveToPoint(ctx, 100, 300);
CGContextAddQuadCurveToPoint(ctx, 200, 200, 300, 300)
CGContextAddQuadCurveToPoint(ctx, 200, 400, 100, 300)
CGContextStrokePath(ctx);
// 大家喜欢吃🍦，我就用二阶贝塞尔曲线绘制一个🍦吧，虽然比较简单，但是好像而已蛮像的，
CGContextMoveToPoint(ctx, 200, 400);
CGContextAddQuadCurveToPoint(ctx, 250, 355, 300, 400)
CGContextAddQuadCurveToPoint(ctx, 250, 755, 200, 400)
CGContextStrokePath(ctx);
}
运行后效果图
效果图.png
总结及问题
本文介绍了使用swift绘图相关的一些知识，然后用绘制圆形的各种方式来举例子说明如何绘图。
那么问题来了？
- drawRect是一个不被建议使用的api，为什么我们还是要用？为什么不推荐使用
- 如果要你绘制一个圆角矩形，你如何做？
- 如何绘制圆形图片？
- 如何给绘制的圆形图片加上border？
- CGContextFillPath(ctx); CGContextStrokePath(ctx) // 该代码无效了,为什么后面一句代码无效？
