Quartz2D五角星绘制教程
Quartz2D 的图形绘制能力挺强，是做一些自定义图形时，比如五角星这种稍微复杂点的形状，用起来还蛮方便的。只要你搞清楚了CGContext的用法，加上路径的连接方式，基本就能画出自己想要的图案。
五角星其实就是 10 个点的组合，外圈 5 个点，内圈 5 个点交错着连，连成之后就是那个经典的星星形状。在UIView的draw(_ rect:)方法里，先拿到当前CGContext，设定线宽、颜色等基本样式。
像下面这样设置绘图环境：
override func draw(_ rect: CGRect) {
guard let context = UIGraphicsGetCurrentContext() else { return }
context.setStrokeColor(UIColor.red.cgColor)
context.setLineWidth(3.0)
// 继续绘图逻辑
}坐标计算上也不复杂，就是用三角函数去算出五角星每个点的位置。可以先算外圈的 5 个点，向中心缩小一点，插进去内圈的 5 个点。
整段逻辑其实比较适合你用来练手 Quartz2D，理解下路径的构建、坐标系、角度计算这些东西。如果你还没怎么接触过 Quartz2D，画个五角星是个不错的入门练习。
如果你对这个话题感兴趣，可以看看Swift 版的五角星绘制，还有其他像Quartz2D 的渐变演示也挺有意思的。
哦对了，绘制时记得考虑坐标系的原点在左上角，要是画出来方向不对，别慌，调整下角度就好了。
文件大小：32.89KB
评论区