重写 draw(rect:) 方法进行绘制

准备好释放你的创造力了吗？🎨 在 iOS 开发中，draw(rect:) 方法是自定义绘制的核心。通过重写这个方法，你可以在 UIView 的子类中实现各种各样的图形绘制，从简单的形状到复杂的自定义视图，一切皆有可能！

了解 draw(rect:) 方法

draw(rect:) 方法是 UIView 的一个重要组成部分。当你需要自定义视图的外观时，你会重写这个方法。系统会在需要重绘视图时调用它，例如，当视图第一次显示时，或者当视图的 bounds 发生改变时。

• rect 参数: 这个参数是一个 CGRect 结构体，它定义了需要重绘的视图区域。你可以利用这个信息来优化你的绘制代码，只绘制需要更新的部分。

• 图形上下文: 在 draw(rect:) 方法中，你会使用图形上下文 (Graphics Context) 来进行绘制。图形上下文是一个抽象的绘图表面，你可以使用它来绘制线条、形状、文本和图像。

创建自定义视图

首先，你需要创建一个 UIView 的子类。例如，你可以创建一个名为 MyCustomView 的类。

import UIKit

class MyCustomView: UIView {

    override func draw(_ rect: CGRect) {
        // 在这里添加你的绘制代码
    }
}

使用 Core Graphics 进行绘制

Core Graphics 是 iOS 中强大的 2D 绘图框架。它提供了丰富的 API，可以让你绘制各种各样的图形。

1. 获取图形上下文: 在 draw(rect:) 方法中，你需要首先获取当前的图形上下文。你可以使用 UIGraphicsGetCurrentContext() 函数来获取它。

2. 设置绘图属性: 在绘制之前，你可以设置各种绘图属性，例如颜色、线宽和填充样式。

3. 绘制形状: 使用 UIBezierPath 类可以方便地创建和绘制各种形状，例如矩形、圆形和弧线。

   • 例如，绘制一个红色矩形：

   let context = UIGraphicsGetCurrentContext()!
   UIColor.red.setFill()
   let rectangle = CGRect(x: 0, y: 0, width: 100, height: 50)
   context.fill(rectangle)

4. 绘制文本: 你可以使用 NSString 的 draw(in:withAttributes:) 方法来绘制文本。

   • 例如，绘制一段文本：

   let text = "Hello, World!" as NSString
   let attributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 16)]
   text.draw(in: rect, withAttributes: attributes)

优化绘制性能

• 避免复杂的计算: 尽量避免在 draw(rect:) 方法中进行复杂的计算，因为这会影响绘制性能。
• 缓存绘制结果: 如果你的视图需要绘制静态内容，可以考虑将绘制结果缓存起来，避免每次都重新绘制。
• 只绘制需要更新的区域: 利用 rect 参数，只绘制需要更新的视图区域。

示例：绘制一个简单的饼图 🥧

让我们通过一个简单的例子来演示如何使用 draw(rect:) 方法绘制一个饼图。

import UIKit

class PieChartView: UIView {

    var data: [CGFloat] = [30, 50, 20]
    var colors: [UIColor] = [.red, .green, .blue]

    override func draw(_ rect: CGRect) {
        let center = CGPoint(x: rect.midX, y: rect.midY)
        let radius = min(rect.width, rect.height) / 2
        var startAngle: CGFloat = 0

        for (index, value) in data.enumerated() {
            let angle = 2 * .pi * value / 100
            let endAngle = startAngle + angle

            let path = UIBezierPath(arcCenter: center, radius: radius, startAngle: startAngle, endAngle: endAngle, clockwise: true)
            path.addLine(to: center)
            path.close()

            colors[index].setFill()
            path.fill()

            startAngle = endAngle
        }
    }
}

现在，你已经掌握了重写 draw(rect:) 方法进行绘制的基础知识。🎉 尽情发挥你的想象力，创造出令人惊艳的自定义视图吧！记住，实践是最好的老师。多尝试，多探索，你一定能成为一名优秀的 iOS 开发者！