SwiftUI Image如何使用UIImage CGImage CIImage

蘋(píng)果提供的圖片對(duì)象

UIImage沃但，它來(lái)自UIKit线召。這是一種非常強(qiáng)大的圖像類(lèi)型平痰，能夠處理各種圖像類(lèi)型揣苏，包括位圖（如PNG），矢量（如SVG）君珠，甚至是形成動(dòng)畫(huà)的序列八千。 UIImage是UIKit的標(biāo)準(zhǔn)圖像類(lèi)型丈咐，在三種類(lèi)型中闲孤，它最接近SwiftUI的圖像類(lèi)型谆级。
CGImage，來(lái)自Core Graphics讼积。這是一種更簡(jiǎn)單的圖像類(lèi)型，實(shí)際上只是一個(gè)二維像素陣列脚仔。
CIImage勤众，來(lái)自Core Image。它將存儲(chǔ)生成圖像所需的所有信息鲤脏，但實(shí)際上不會(huì)將其轉(zhuǎn)換為像素（除非要求）们颜。蘋(píng)果將??CIImage稱(chēng)為“圖像配方”，而不是實(shí)際圖像猎醇。

各種圖像類(lèi)型之間存在一些互操作性

我們可以從CGImage創(chuàng)建UIImage窥突，并從UIImage創(chuàng)建CGImage。
我們可以從UIImage和CGImage創(chuàng)建CIImage硫嘶，也可以從CIImage創(chuàng)建CGImage阻问。
我們可以從UIImage和CGImage創(chuàng)建一個(gè)SwiftUI圖像。

SwiftUI和圖像們的關(guān)系

這些圖像類(lèi)型是純數(shù)據(jù)對(duì)象沦疾，我們無(wú)法將它們放入SwiftUI視圖層次結(jié)構(gòu)中称近，但是我們可以自由地對(duì)其進(jìn)行操作，然后將結(jié)果呈現(xiàn)在SwiftUI圖像中哮塞。

我們將更改loadImage（）刨秆，以便它從示例圖像中創(chuàng)建一個(gè)UIImage，然后使用Core Image對(duì)其進(jìn)行操作忆畅。更具體地說(shuō)衡未，我們將從兩項(xiàng)任務(wù)開(kāi)始：

func loadImage() {
    guard let inputImage = UIImage(named: "Example") else { return }
 // 將UIImage轉(zhuǎn)換為CIImage
    let beginImage = CIImage(image: inputImage)

    // 下面我們可以使用Core Image庫(kù)進(jìn)行圖像處理
}

下一步將創(chuàng)建一個(gè)Core Image上下文和一個(gè)Core Image過(guò)濾器。過(guò)濾器是完成以某種方式轉(zhuǎn)換圖像數(shù)據(jù)的實(shí)際工作的東西，例如模糊缓醋，銳化如失，調(diào)整顏色等，上下文則將處理后的數(shù)據(jù)轉(zhuǎn)換為我們可以使用的CGImage改衩。

這兩種數(shù)據(jù)類(lèi)型均來(lái)自Core Image岖常，因此您需要添加兩次導(dǎo)入才能將其提供給我們。因此葫督，請(qǐng)先在ContentView.swift頂部附近添加以下內(nèi)容：

import CoreImage
import CoreImage.CIFilterBuiltins

接下來(lái)竭鞍，我們將創(chuàng)建上下文并進(jìn)行過(guò)濾。在此示例中橄镜，我們將使用棕褐色調(diào)濾鏡偎快，該濾鏡會(huì)應(yīng)用棕色調(diào)，使照片看起來(lái)像是很久以前拍攝的洽胶。

因此晒夹，替換//更多代碼以對(duì)此進(jìn)行注釋?zhuān)?/p>

let context = CIContext()
let currentFilter = CIFilter.sepiaTone()

現(xiàn)在，我們可以自定義過(guò)濾器以更改其工作方式姊氓。棕褐色是一個(gè)簡(jiǎn)單的濾鏡丐怯，因此它只有兩個(gè)有趣的屬性：inputImage是我們要更改的圖像，而強(qiáng)度是應(yīng)該應(yīng)用棕褐色效果的強(qiáng)度翔横，在0（原始圖像）和1（完整棕褐色）的范圍內(nèi)指定读跷。

因此，在前兩行下面添加以下兩行代碼：

currentFilter.inputImage = beginImage
currentFilter.intensity = 1

所有這些都不是很難的禾唁，但是這里發(fā)生了改變：我們需要將過(guò)濾器的輸出轉(zhuǎn)換為可以在視圖中顯示的SwiftUI圖像效览。這是我們需要一次依靠所有四種圖像類(lèi)型的地方，因?yàn)樽詈?jiǎn)單的操作是：

從我們的過(guò)濾器讀取輸出圖像荡短，它將是CIImage丐枉。這可能會(huì)失敗，因此它返回一個(gè)可選掘托。
詢(xún)問(wèn)我們的上下文瘦锹，從該輸出圖像創(chuàng)建CGImage。這也可能會(huì)失敗烫映，因此再次返回一個(gè)可選沼本。
將該CGImage轉(zhuǎn)換為UIImage。
將該UIImage轉(zhuǎn)換為SwiftUI圖像锭沟。
您可以直接從CGImage轉(zhuǎn)到SwiftUI圖像抽兆，但它需要額外的參數(shù)，并且只會(huì)增加更多的復(fù)雜性族淮！

這是loadImage（）的最終代碼：

// get a CIImage from our filter or exit if that fails
guard let outputImage = currentFilter.outputImage else { return }

// attempt to get a CGImage from our CIImage
if let cgimg = context.createCGImage(outputImage, from: outputImage.extent) {
    // convert that to a UIImage
    let uiImage = UIImage(cgImage: cgimg)

    // and convert that to a SwiftUI image
    image = Image(uiImage: uiImage)
}

如果再次運(yùn)行該應(yīng)用程序辫红，您應(yīng)該會(huì)看到示例圖像現(xiàn)在已應(yīng)用了棕褐色效果凭涂，這全歸功于Core Image。

現(xiàn)在贴妻，您可能會(huì)認(rèn)為切油，要獲得一個(gè)相當(dāng)簡(jiǎn)單的結(jié)果，這是一件繁瑣的工作名惩，但是現(xiàn)在您已經(jīng)掌握了Core Image的所有基礎(chǔ)知識(shí)澎胡，因此切換到其他過(guò)濾器相對(duì)容易。

我們需要將示例圖像加載到UIImage中娩鹉，該圖像具有一個(gè)名為UIImage（name :)的初始化程序攻谁，以從資產(chǎn)目錄中加載圖像。它返回一個(gè)可選的UIImage弯予，因?yàn)槲覀兛赡苤付瞬淮嬖诘膱D像戚宦。
我們將其轉(zhuǎn)換為CIImage，這是Core Image想要使用的锈嫩。
因此受楼，首先用以下代碼替換當(dāng)前的loadImage（）實(shí)現(xiàn)：

SwiftUI Image如何使用UIImage CGImage CIImage

SwiftUI Image如何使用UIImage CGImage CIImage

蘋(píng)果提供的圖片對(duì)象

各種圖像類(lèi)型之間存在一些互操作性

SwiftUI和圖像們的關(guān)系

推薦

基礎(chǔ)文章推薦

經(jīng)典教程推薦

技術(shù)源碼推薦

推薦文章

CoreData篇

Combine篇

TextField篇

JSON文件篇

一篇文章系列

技術(shù)交流