iOS 绘制五角星(评分)

最近项目中用到做评分功能,需要用到绘制星星,效果如下 下载地址

10010.gif

• 其关键点就是实现星星的绘制,那么如何实现五角星的绘制?

1. 创建继承自UIView的子类
2. 重写子类的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地址