Swift - Core Graphics绘图框架详解2(绘制图形)
作者:hangge | 2016-11-18 09:00
1,绘制矩形
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let frame = CGRect(x: 30, y: 30, width: 250, height: 100)
let cgView = CGView(frame: frame)
self.view.addSubview(cgView)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
class CGView:UIView {
override init(frame: CGRect) {
super.init(frame: frame)
//设置背景色为透明,否则是黑色背景
self.backgroundColor = UIColor.clear
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
//获取绘图上下文
guard let context = UIGraphicsGetCurrentContext() else {
return
}
//创建一个矩形,它的所有边都内缩3点
let drawingRect = self.bounds.insetBy(dx: 3, dy: 3)
//创建并设置路径
let path = CGMutablePath()
//绘制矩形
path.addRect(drawingRect)
//添加路径到图形上下文
context.addPath(path)
//设置笔触颜色
context.setStrokeColor(UIColor.orange.cgColor)
//设置笔触宽度
context.setLineWidth(6)
//设置填充颜色
context.setFillColor(UIColor.blue.cgColor)
//绘制路径并填充
context.drawPath(using: .fillStroke)
}
}
2,绘制圆角矩形
class CGView:UIView {
override init(frame: CGRect) {
super.init(frame: frame)
//设置背景色为透明,否则是黑色背景
self.backgroundColor = UIColor.clear
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
//获取绘图上下文
guard let context = UIGraphicsGetCurrentContext() else {
return
}
//创建一个矩形,它的所有边都内缩3点
let drawingRect = self.bounds.insetBy(dx: 3, dy: 3)
//创建并设置路径
let path = CGMutablePath()
//绘制矩形
path.addRoundedRect(in: drawingRect, cornerWidth: 10, cornerHeight: 10)
//添加路径到图形上下文
context.addPath(path)
//设置笔触颜色
context.setStrokeColor(UIColor.orange.cgColor)
//设置笔触宽度
context.setLineWidth(6)
//设置填充颜色
context.setFillColor(UIColor.blue.cgColor)
//绘制路径并填充
context.drawPath(using: .fillStroke)
}
}
3,绘制圆形
绘制正圆和绘制椭圆都是使用 addEllipse() 方法。如果宽高都一样就是正圆形。
class CGView:UIView {
override init(frame: CGRect) {
super.init(frame: frame)
//设置背景色为透明,否则是黑色背景
self.backgroundColor = UIColor.clear
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
//获取绘图上下文
guard let context = UIGraphicsGetCurrentContext() else {
return
}
//创建并设置路径
let path = CGMutablePath()
//绘制正圆
let minWidth = min(self.bounds.width, self.bounds.height)
path.addEllipse(in: CGRect(x: 3, y: 3, width: minWidth-6, height: minWidth-6))
//添加路径到图形上下文
context.addPath(path)
//设置笔触颜色
context.setStrokeColor(UIColor.orange.cgColor)
//设置笔触宽度
context.setLineWidth(6)
//设置填充颜色
context.setFillColor(UIColor.blue.cgColor)
//绘制路径并填充
context.drawPath(using: .fillStroke)
}
}
4,绘制椭圆
绘制正圆和绘制椭圆都是使用 addEllipse() 方法。如果宽高不一样就是椭圆形。
class CGView:UIView {
override init(frame: CGRect) {
super.init(frame: frame)
//设置背景色为透明,否则是黑色背景
self.backgroundColor = UIColor.clear
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
//获取绘图上下文
guard let context = UIGraphicsGetCurrentContext() else {
return
}
//创建一个矩形,它的所有边都内缩3点
let drawingRect = self.bounds.insetBy(dx: 3, dy: 3)
//创建并设置路径
let path = CGMutablePath()
//绘制椭圆
path.addEllipse(in: drawingRect)
//添加路径到图形上下文
context.addPath(path)
//设置笔触颜色
context.setStrokeColor(UIColor.orange.cgColor)
//设置笔触宽度
context.setLineWidth(6)
//设置填充颜色
context.setFillColor(UIColor.blue.cgColor)
//绘制路径并填充
context.drawPath(using: .fillStroke)
}
}
5,复杂图形的绘制
应用中有时会需要绘制一些不规则的图形。我们可以通过多段路径链接,或者多条子路径组合的形式来实现。具体参考我原来写的两篇文章:
全部评论(3)
这种是静态图像,如果在运行的过程中需要改变图形的颜色,就需要反复调用draw方法,调用setNeedDisplay方法,系统会自动调用draw方法,里面的路径如何处理?只创建,不释放吗?
站长回复:明白你的意思了。反复通过setNeedDisplay方法调用draw,view会不断地重绘。而原来方法里创建的路径可以不用管它,系统会自动释放。
请问一下路径不用释放吗?如果我方法调用draw方法?
站长回复:不用。UIView初始化后会自动调用draw,我们不用也不应该再次人为地去调用它。
站长你好,请问 UIbezierpath 和 CGMutablePath都是用来绘制路径的吗?两者有什么区别吗?
站长回复:其实我在前一篇里的Core Graphics介绍部分也有讲过:Swift - Core Graphics绘图框架详解1(绘制线条)