iOS - 浅谈Core Graphics

我正在参加「掘金·启航计划」

前言

Core Graphics（又称为Quartz）是iOS开发中的一个绘图框架，用于在屏幕上绘制2D图形和进行图像处理。它提供了一组强大的图形绘制和处理函数，可以创建各种形状、路径、渐变、图像、文本等，并进行变换、组合、裁剪等操作。

图形上下文（CGContext）：

CGContext是Core Graphics的绘制环境，用于描述和管理绘制操作。可以创建CGContext实例，并将其与目标绘制表面相关联，然后使用绘制函数绘制图形。

class TestView: UIView {
    override func draw(_ rect: CGRect) {
        guard let context = UIGraphicsGetCurrentContext() else { return }
        
        // 设置绘制参数
        context.setFillColor(UIColor.red.cgColor)
        context.setStrokeColor(UIColor.blue.cgColor)
        context.setLineWidth(2.0)
        
        // 创建路径
        let path = UIBezierPath()
        path.move(to: CGPoint(x: 50, y: 50))
        path.addLine(to: CGPoint(x: 150, y: 150))
        path.addQuadCurve(to: CGPoint(x: 250, y: 50), controlPoint: CGPoint(x: 150, y: 0))
        
        // 将路径添加到上下文并绘制
        context.addPath(path.cgPath)
        context.fillPath()
        context.strokePath()
    }
}

class XSWCoreGraphicsViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        view.backgroundColor = .white
        
        let testView = TestView(frame: CGRect(x: 0, y: 100, width: 300, height: 300))
        testView.backgroundColor = .white
        view.addSubview(testView)
    }
}

绘制基本形状

Core Graphics提供了绘制基本形状的函数，如绘制线段、矩形、圆形、椭圆等。可以设置边框、填充颜色、线条样式等属性来自定义形状的外观。

guard let context = UIGraphicsGetCurrentContext() else { return }
context.setStrokeColor(UIColor.red.cgColor)
context.setLineWidth(2.0)
context.addRect(CGRect(x: 50, y: 50, width: 100, height: 100))
context.strokePath()

路径绘制

可以使用路径（CGPath）来描述和绘制复杂的形状，如曲线、多边形等。可以添加直线段、曲线段、弧线段等到路径中，并设置绘制属性和样式。

guard let context = UIGraphicsGetCurrentContext() else { return }
context.setStrokeColor(UIColor.blue.cgColor)
context.setLineWidth(2.0)
let path = UIBezierPath()
path.move(to: CGPoint(x: 50, y: 50))
path.addLine(to: CGPoint(x: 150, y: 150))
path.addQuadCurve(to: CGPoint(x: 250, y: 50), controlPoint: CGPoint(x: 150, y: 0))
context.addPath(path.cgPath)
context.strokePath()

渐变和图案填充

Core Graphics支持渐变填充和图案填充。可以创建线性渐变、径向渐变、色彩空间和图案对象，并将其应用于形状或路径的填充或边框。

guard let context = UIGraphicsGetCurrentContext() else { return }
let colors = [UIColor.red.cgColor, UIColor.yellow.cgColor]
let colorSpace = CGColorSpaceCreateDeviceRGB()
let gradient = CGGradient(colorsSpace: colorSpace, colors: colors as CFArray, locations: nil)
let startPoint = CGPoint(x: 0, y: 0)
let endPoint = CGPoint(x: rect.width, y: rect.height)
context.drawLinearGradient(gradient!, start: startPoint, end: endPoint, options: [])

图像处理

Core Graphics提供了一些图像处理功能，如图像缩放、裁剪、旋转、颜色处理等。可以使用CGImage和CGDataProvider来表示和操作图像数据。

guard let context = UIGraphicsGetCurrentContext() else { return }
if let image = UIImage(named: "风景.jpg") {
    let imageRect = CGRect(x: 0, y: 0, width: image.size.width, height: image.size.height)
    context.draw(image.cgImage!, in: imageRect)
}

文本绘制

可以使用Core Graphics绘制文本，并设置字体、字号、颜色、对齐方式等属性。还可以进行文本布局和路径文本绘制。

guard let context = UIGraphicsGetCurrentContext() else { return }
let text = "Hello, World!"
let font = UIFont.systemFont(ofSize: 20)
let attributes = [NSAttributedString.Key.font: font, NSAttributedString.Key.foregroundColor: UIColor.black]
let attributedText = NSAttributedString(string: text, attributes: attributes)
attributedText.draw(at: CGPoint(x: 50, y: 50))

图形变换

Core Graphics提供了图形变换的功能，如平移、旋转、缩放、翻转等。可以通过设置变换矩阵来应用变换操作。

// 图形变换：
guard let context = UIGraphicsGetCurrentContext() else { return }

// 创建一个矩形路径
let rectPath = UIBezierPath(rect: CGRect(x: 50, y: 50, width: 100, height: 100))

// 保存当前图形上下文状态
context.saveGState()

// 创建一个仿射变换，进行平移、旋转和缩放变换
var transform = CGAffineTransform.identity
transform = transform.translatedBy(x: 200, y: 200)
transform = transform.rotated(by: CGFloat.pi / 4)
transform = transform.scaledBy(x: 1.5, y: 1.5)

// 将变换应用到路径上
rectPath.apply(transform)

// 将路径添加到上下文中并绘制
context.addPath(rectPath.cgPath)
context.setFillColor(UIColor.red.cgColor)
context.fillPath()

// 恢复图形上下文到之前保存的状态
context.restoreGState()

结尾

Core Graphics是一个底层的绘图框架，使用时需要手动管理绘图上下文、路径、资源等，对性能和内存的使用也需要注意。在实际开发中，也可以考虑使用更高级的绘图库和框架，如UIKit和Core Animation，它们提供了更简单、易用的接口来实现常见的绘图和动画效果。

上面只是Core Graphics 的很小一部分特性，实际可以根据需求进行进一步探索和使用。