最近项目中用到做评分功能,需要用到绘制星星,效果如下 下载地址
10010.gif
- 其关键点就是实现星星的绘制,那么如何实现五角星的绘制?
- 创建继承自
UIView的子类- 重写子类的
drawRecct方法,通过drawRect方法重新绘制view
- 代码如下
override func draw(_ rect: CGRect) {
super.draw(rect)
self.backgroundColor = UIColor.clear
var points: [CGPoint] = []
let context = UIGraphicsGetCurrentContext()
context?.setStrokeColor(UIColor.clear.cgColor)
context?.setFillColor(starColor.cgColor) //填充色,即为五角星的颜色
context?.setLineWidth(1)
let radius = Float(self.bounds.width / 2)
let angel = Double.pi * 2 / 5
for i in 1...5 { //这里是获取五角星的五个定点的坐标点位置
let x = Float(self.bounds.width / 2) - sinf(Float(i) * Float(angel)) * radius
let y = Float(self.bounds.height / 2) - cosf(Float(i) * Float(angel)) * radius
points.append(CGPoint(x: CGFloat(x), y: CGFloat(y)))
}
context?.move(to: points.first!)
for i in 1...5 {//将上面获取的五个点依次连接1->3->5->2->4->1个点,绘制出五角星
let index = (2 * i) % 5
context?.addLine(to: points[index])
}
context?.closePath()
context?.drawPath(using: CGPathDrawingMode.fillStroke)
}
- 最后,附上Demo地址
