【SwiftUI 100 天】打造 Instafilter：初探 Core Image 的图像滤镜

随着我们手中的用户图像落定，现在是时候让用户使用各种 Core Image 滤镜了。我们将从一个简单的滤镜开始，逐步升级到操作表的使用。为此，我们离不开一个上下文和滤镜。Core Image 上下文负责渲染 CIImage，而滤镜负责修改图像的像素。

建立上下文

首先，让我们创建一个 Core Image 上下文。这将为我们的图像滤镜处理提供画布。

let context = CIContext()

应用滤镜

现在我们有了上下文，就可以开始应用滤镜了。Core Image 提供了大量的滤镜，涵盖了从颜色调整到图像变形等各种效果。对于我们的第一个滤镜，我们选择一个经典之作：Sepia Tone。

let filter = CIFilter(name: "CISepiaTone")!
filter.setValue(CIImage(image: image), forKey: kCIInputImageKey)
filter.setValue(0.7, forKey: kCIInputIntensityKey)

let outputImage = filter.outputImage!

我们创建了一个名为“CISepiaTone”的滤镜，并将其应用于输入图像。intensity 键控制滤镜的强度，我们将其设置为 0.7 以获得适度的复古效果。

渲染图像

应用滤镜后，我们需要将输出图像渲染到屏幕上。为此，我们将使用我们在前面创建的上下文。

let cgImage = context.createCGImage(outputImage, from: outputImage.extent)
let uiImage = UIImage(cgImage: cgImage!)

我们首先创建一个 CGImage，然后将其转换为 UIImage，这是 SwiftUI 可以接受的格式。

在 SwiftUI 中显示图像

有了图像后，我们可以在 SwiftUI 视图中显示它。

struct ContentView: View {
    @State private var image: UIImage?

    var body: some View {
        VStack {
            Image(uiImage: image!)
                .resizable()
                .aspectRatio(contentMode: .fit)
        }
        .onAppear {
            // 在这里应用滤镜
        }
}

在 onAppear 中，我们应用滤镜并更新图像状态。随着图像的变化，UI 将自动更新。

更多滤镜，更多可能性

随着我们对 Core Image 的深入探索，滤镜的世界将向我们敞开大门。从模糊到扭曲，从颜色调整到变形，滤镜为我们提供了丰富的工具，可以将我们的图像提升到新的高度。

实例代码

import SwiftUI
import CoreImage

struct ContentView: View {
    @State private var image: UIImage?

    var body: some View {
        VStack {
            Image(uiImage: image!)
                .resizable()
                .aspectRatio(contentMode: .fit)
        }
        .onAppear {
            let context = CIContext()
            let filter = CIFilter(name: "CISepiaTone")!
            filter.setValue(CIImage(image: image!), forKey: kCIInputImageKey)
            filter.setValue(0.7, forKey: kCIInputIntensityKey)

            let outputImage = filter.outputImage!
            let cgImage = context.createCGImage(outputImage, from: outputImage.extent)
            let uiImage = UIImage(cgImage: cgImage!)

            self.image = uiImage
        }
    }
}