Giới thiệu về khả năng quét văn bản và mã vạch với VisionKit

Trong bài viết này, bạn sẽ học cách tích hợp chức năng quét văn bản và mã vạch vào ứng dụng iOS của mình thông qua VisionKit, một thư viện mạnh mẽ của Apple. Với việc ra mắt DataScannerViewController trong iOS 16, Apple đã cung cấp một API dễ sử dụng cho phép các nhà phát triển quét các loại dữ liệu khác nhau như văn bản và mã vạch chỉ bằng một cú nhấp chuột.

Khám Phá DataScannerViewController

DataScannerViewController là một lớp kế thừa từ UIViewController. Với API này, bạn có thể:

• Hướng dẫn người dùng: Cung cấp các chỉ dẫn trực quan cho người dùng.
• Highlight: Bắt buộc đánh dấu văn bản hoặc mã vạch nhận diện ngay trên màn hình.
• Pinch-to-Zoom: Tính năng phóng to và thu nhỏ giúp cải thiện độ chính xác.

Cách sử dụng DataScannerViewController

1. Yêu cầu quyền truy cập camera (bắt buộc)

Trước khi bạn có thể quét, cần yêu cầu quyền truy cập camera bằng cách thêm khóa NSCameraUsageDescription vào file Info.plist của dự án bạn.

<key>NSCameraUsageDescription</key>
<string>Chúng tôi cần quyền truy cập vào camera để quét mã QR và văn bản.</string>

2. Kiểm tra tính khả dụng

Kiểm tra xem thiết bị có hỗ trợ DataScannerViewController hay không. Bạn có thể sử dụng thuộc tính isSupported và isAvailable:

if DataScannerViewController.isSupported && DataScannerViewController.isAvailable {
    // Tiến hành khởi tạo DataScannerViewController
}

3. Tạo DataScannerViewController

Tạo một đối tượng DataScannerViewController như sau:

var scannerViewController: DataScannerViewController = DataScannerViewController(
    recognizedDataTypes: [.text(), .barcode()],
    qualityLevel: .accurate,
    recognizesMultipleItems: false,
    isHighFrameRateTrackingEnabled: false,
    isHighlightingEnabled: true
)

Các loại dữ liệu quét như Barcode/QRCode có thể tham khảo tại tài liệu Apple.

4. Implement các phương thức delegate

Để xử lý các dữ liệu quét được, bạn cần triển khai các phương thức của DataScannerViewControllerDelegate:

func dataScanner(_ scanner: DataScannerViewController, didTapOn item: RecognizedItem) {
    switch item {
    case .barcode(let barcode):
        if let payload = barcode.payloadStringValue {
            // Xử lý mã QR hoặc mã vạch
            openURL(payload)
        }
    case .text(let text):
        // Xử lý văn bản được nhận diện
        print("Văn bản nhận diện: \(text.transcript)")
    default:
        break
    }
}

5. Hiển thị DataScannerViewController

Cuối cùng, bạn chỉ cần hiển thị DataScannerViewController để người dùng có thể bắt đầu quét:

present(scannerViewController, animated: true)

Sử dụng DataScannerViewController trong SwiftUI

Trong SwiftUI, bạn có thể tích hợp DataScannerViewController dễ dàng hơn bằng cách sử dụng UIViewControllerRepresentable. Dưới đây là một ví dụ:

import SwiftUI
import VisionKit

@MainActor
struct DocumentScannerView: UIViewControllerRepresentable {
    // Khởi tạo scannerViewController
    var scannerViewController: DataScannerViewController = DataScannerViewController(...)
    
    // Thực hiện các phương thức cần thiết như makeUIViewController và updateUIViewController
    
    class Coordinator: NSObject, DataScannerViewControllerDelegate {
        // Xử lý các sự kiện quét ở đây
    }
}

Bạn có thể tùy chỉnh overlay view để tạo các khung và thông tin cho các đối tượng đã được nhận diện. Hãy tận dụng cơ hội này để tạo một ứng dụng hữu ích cho người dùng của bạn!

Kết luận

Việc tích hợp tính năng quét văn bản và mã vạch vào ứng dụng của bạn không còn khó khăn với VisionKit. Với hướng dẫn này, hy vọng bạn có thể nhanh chóng áp dụng và tạo ra các trải nghiệm thú vị cho người dùng.
source: viblo