AI

如何使用 Vision APIs 從圖像中辨識文字

如何使用 Vision APIs 從圖像中辨識文字
Photo by Morgan Housel / Unsplash
如何使用 Vision APIs 從圖像中辨識文字
Photo by Morgan Housel / Unsplash
In: AI, SwiftUI 框架

Vision 框架長期以來一直包含文字識別功能。我們已經有詳細的教程,向你展示如何使用 Vision 框架掃描圖像並執行文字識別。之前,我們使用了 VNImageRequestHandlerVNRecognizeTextRequest 來從圖像中提取文字。

多年來,Vision 框架已經顯著演變。在 iOS 18 中,Vision 引入了利用 Swift 6 新功能的 API。在本教程中,我們將探索如何使用這些新 API 來執行文字辨識。你會驚訝於框架的改進,它節省了大量程式碼來實現相同的功能。

一如既往,我們將創建一個示範 App 來引導你使用這些 API。我們將構建一個簡單的 App,允許用戶從照片庫中選擇圖像,應用程序將即時提取其中的文字。

讓我們開始吧。

使用 PhotosPicker 加載照片庫

假設你已經在 Xcode 16 上創建了一個新的 SwiftUI 項目,轉到 ContentView.swift 並開始構建演示應用程序的基本 UI:

import SwiftUI
import PhotosUI

struct ContentView: View {
    
    @State private var selectedItem: PhotosPickerItem?
    
    @State private var recognizedText: String = "No text is detected"
    
    var body: some View {
        VStack {
            ScrollView {
                VStack {
                    Text(recognizedText)
                }
            }
            .contentMargins(.horizontal, 20.0, for: .scrollContent)
            
            Spacer()
            
            PhotosPicker(selection: $selectedItem, matching: .images) {
                Label("Select a photo", systemImage: "photo")
            }
            .photosPickerStyle(.inline)
            .photosPickerDisabledCapabilities([.selectionActions])
            .frame(height: 400)
            
        }
        .ignoresSafeArea(edges: .bottom)
    }
}

我們使用 PhotosPicker 訪問照片庫並在屏幕的下部加載圖像。螢幕的上部設有一個滾動視圖來顯示識別出的文字。

我們有一個狀態變數來追踪所選照片。為了檢測選定的圖像並將其加載為數據,你可以將 onChange 修飾符附加到 PhotosPicker 視圖,如下所示:

.onChange(of: selectedItem) { oldItem, newItem in
    Task {
        guard let imageData = try? await newItem?.loadTransferable(type: Data.self) else {
            return
        }
    }
}

使用 Vision 進行文字識別

Vision 框架中的新 API 簡化了文字識別的實現。Vision 提供了 31 種不同的請求類型,每種類型都針對特定的圖像分析。例如,DetectBarcodesRequest 用於識別和解碼條形碼。對於我們的目的,我們將使用 RecognizeTextRequest

ContentView 中,添加一個 import 語句來導入 Vision,並創建一個名為 recognizeText 的新函數:

private func recognizeText(image: UIImage) async {
    guard let cgImage = image.cgImage else { return }
    
    let textRequest = RecognizeTextRequest()
    
    let handler = ImageRequestHandler(cgImage)
    
    do {
        let result = try await handler.perform(textRequest)
        let recognizedStrings = result.compactMap { observation in
            observation.topCandidates(1).first?.string
        }
        
        recognizedText = recognizedStrings.joined(separator: "\n")
        
    } catch {
        recognizedText = "Failed to recognized text"
        print(error)
    }
}

這個函數接收一個 UIImage 對象,即所選的照片,並從中提取文字。RecognizeTextRequest 對象旨在識別圖像中的矩形文字區域。

ImageRequestHandler 對象處理給定圖像上的文字識別請求。當我們調用其 perform 函數時,它會將結果以 RecognizedTextObservation 對象的形式返回,每個對象包含有關識別文字的位置和內容的詳細信息。

然後,我們使用 compactMap 提取識別出的字符串。topCandidates 方法返回識別文字的最佳匹配。通過將候選數量的最大值設置為 1,我們確保只檢索到最佳候選。

最後,我們使用 joined 方法將所有識別出的字符串連接起來。

隨著 recognizeText 方法的就位,我們可以更新 onChange 修飾符來調用此方法,對所選照片進行文字識別。

.onChange(of: selectedItem) { oldItem, newItem in
    Task {
        guard let imageData = try? await newItem?.loadTransferable(type: Data.self) else {
            return
        }
        
        await recognizeText(image: UIImage(data: imageData)!)
    }
}

改動完成後,你現在可以在模擬器中運行應用程序來進行測試。如果你有包含文字的照片,此範例 App 應該能夠成功提取並顯示文字。

總結

隨著 iOS 18 引入新 Vision API ,我們現在可以非常輕鬆地開發文字識別功能,僅需幾行程式碼即可實現。簡化的APIs允許開發人員快速有效地將文字識別功能整合到應用程序中。

你對 Vision 框架的這個改進有什麼看法?歡迎在下方留言分享你的想法。

作者
Simon Ng
軟體工程師,AppCoda 創辦人。著有《iOS 18 App 程式設計實戰心法》、《iOS 18 App程式設計進階攻略》以及《精通SwiftUI》。曾任職於HSBC, FedEx等跨國企業,專責軟體開發、系統設計。2012年創立AppCoda技術部落格,定期發表iOS程式教學文章。現時專注發展AppCoda業務,致力於iOS程式教學、產品設計及開發。你可以到推特與我聯絡。
評論
更多來自 AppCoda 中文版
活用 Foundation Models 的 @Generable 與 @Guide 製作測驗 App
AI

活用 Foundation Models 的 @Generable 與 @Guide 製作測驗 App

在前一篇教學中,我們介紹了 Foundation Models 框架,並示範了如何用它來進行基本的內容生成。那個過程相當簡單——你提供一個提示詞(prompt),等幾秒鐘,就能獲得自然語言的回應。在我們的範例中,我們建立了一個簡單的問答 App,讓使用者可以提問,App 則直接顯示生成的文字。 但如果回應變得更複雜——你需要把非結構化文字轉換為結構化的物件呢? 舉例來說,
很好! 你已成功註冊。
歡迎回來! 你已成功登入。
你已成功訂閱 AppCoda 中文版 電子報。
你的連結已失效。
成功! 請檢查你的電子郵件以獲取用於登入的連結。
好! 你的付費資料已更新。
你的付費方式並未更新。