Apple二维图像绘制框架Core Graphics

Core Graphics 是苹果提供的一种二维图形绘制框架，用于在 iOS、macOS、tvOS 和 watchOS 上高效地绘制矢量图形、图像和路径。它是底层的绘图工具，使用 C 语言接口，功能强大，主要用于开发者需要更高精度和控制权的绘图场景。

在 SwiftUI 中，尽管大部分图形绘制任务可以通过 Path 和 Canvas 完成，但 Core Graphics 的概念和技术依然非常重要，因为 SwiftUI 的许多高级绘图功能（例如自定义形状）依赖于 Core Graphics 的底层实现。

核心概念

1、CGRect：矩形框架，用于定义二维空间中的位置和大小。

2、CGPoint：表示二维空间中的一个点（x, y 坐标）。

3、CGSize：表示尺寸，包含宽度和高度。

4、CGPath：描述矢量路径的集合，用于复杂的绘图操作。

5、CGContext：图形上下文，负责将绘制的内容渲染到屏幕上。

6、颜色与样式：支持填充（fill）、描边（stroke）、透明度（alpha）等。

Core Graphics 和 SwiftUI 的关系

SwiftUI 通过 Canvas 和 Path 等组件封装了 Core Graphics 的许多功能，但在需要自定义高性能绘图时，仍可以直接访问 Core Graphics 的底层功能。

SwiftUI 中使用 Core Graphics 的场景

1、自定义绘图：绘制复杂的形状或图像。

2、图形变换：旋转、缩放、平移等操作。

3、高性能需求：在动态更新的复杂图形界面中，Core Graphics 提供了更底层的优化。

在 SwiftUI 中结合 Core Graphics

SwiftUI 的 Canvas 提供了与 Core Graphics 的接口：

绘图例子：使用 Core Graphics 绘制圆形

import SwiftUI

struct CoreGraphicsView: View {
    var body: some View {
        Canvas { context, size in
            let center = CGPoint(x: size.width / 2, y: size.height / 2)
            let radius = min(size.width, size.height) / 2 - 20
            
            // 使用 Core Graphics 绘制
            context.stroke(
                Path { path in
                    path.addArc(center: center, radius: radius, startAngle: .degrees(0), endAngle: .degrees(360), clockwise: false)
                },
                with: .color(.blue),
                lineWidth: 5
            )
        }
        .frame(width: 200, height: 200)
    }
}

#Preview {
    CoreGraphicsView()
}

Core Graphics 的功能

1、绘制基本图形

直线、矩形、圆、椭圆等。

使用 CGContext 提供的 API 绘制。

2、绘制路径

通过 CGPath 定义复杂路径，然后在上下文中绘制。

3、图像处理

绘制位图图像。

应用滤镜和效果。

4、文本绘制

绘制和调整字体。

5、图形变换

旋转、缩放和平移。

6、渐变和阴影

支持线性渐变、径向渐变和投影效果。

典型用法对比

SwiftUI 与 Core Graphics 绘制路径的对比：

1、使用 SwiftUI 的 Path

struct CirclePathView: View {
    var body: some View {
        Path { path in
            path.addArc(center: CGPoint(x: 100, y: 100), radius: 50, startAngle: .degrees(0), endAngle: .degrees(360), clockwise: true)
        }
        .stroke(Color.red, lineWidth: 2)
    }
}

使用 Core Graphics

import UIKit

class CustomView: UIView {
    override func draw(_ rect: CGRect) {
        guard let context = UIGraphicsGetCurrentContext() else { return }
        context.addArc(center: CGPoint(x: 100, y: 100), radius: 50, startAngle: 0, endAngle: CGFloat.pi * 2, clockwise: true)
        context.setStrokeColor(UIColor.red.cgColor)
        context.setLineWidth(2)
        context.strokePath()
    }
}

相关文章

1、SwiftUI绘画视图Canvas：https://fangjunyu.com/2024/12/16/swiftui%e7%bb%98%e7%94%bb%e8%a7%86%e5%9b%becanvas/

2、SwiftUI绘制自定义形状的Path：https://fangjunyu.com/2024/12/16/swiftui%e7%bb%98%e5%88%b6%e8%87%aa%e5%ae%9a%e4%b9%89%e5%bd%a2%e7%8a%b6%e7%9a%84path/