SwiftUI：带有条形码的图像不显示

Question

我试图呈现一个 UIImage 实例，它是从字符串生成的条形码：

if let image = UIImage(barcode: "1234567890") {
    Image(uiImage: image)
}

但它显示空矩形，尽管在调试中image填充了真实图像：

我使用一个简单的 UIImage 扩展来生成带有字符串条形码的 UIImage：

extension UIImage {

    convenience init?(barcode: String) {
        let data = barcode.data(using: .ascii)
        guard let filter = CIFilter(name: "CICode128BarcodeGenerator") else {
            return nil
        }

        filter.setValue(data, forKey: "inputMessage")
        guard let ciImage = filter.outputImage else {
            return nil
        }

        self.init(ciImage: ciImage)
    }

}

怎么了？有任何想法吗？

Answer 1

是的，看起来像图像有一些缺陷/不兼容。您可以向 Apple 提交反馈。

同时这里有一个解决方法。使用 Xcode 12 / iOS 14 进行测试

struct TestBarCodeView: View {
    var body: some View {
        VStack {
            BarCodeView(barcode: "1234567890")
                .scaledToFit()
                .padding().border(Color.red)
        }
    }
}

struct BarCodeView: UIViewRepresentable {
    let barcode: String
    func makeUIView(context: Context) -> UIImageView {
        UIImageView()
    }

    func updateUIView(_ uiView: UIImageView, context: Context) {
        uiView.image = UIImage(barcode: barcode)
    }
}

Answer 2

没有 UIKit UIViewRepresentable 的条形码

import SwiftUI
import CoreImage.CIFilterBuiltins

extension Image {

    enum BarCode {
        case qrCode
        case code128Barcode
        case pdf417Barcode
        case aztecCode
    }

    init(code: String, _ type: BarCode) {
        let context = CIContext()
        let filter: CIFilter
        switch type {
        case .qrCode:
            let aFilter = CIFilter.qrCodeGenerator()
            aFilter.message = Data(code.utf8)
            filter = aFilter
        case .code128Barcode:
            let aFilter = CIFilter.code128BarcodeGenerator()
            aFilter.message = Data(code.utf8)
            filter = aFilter
        case .pdf417Barcode:
            let aFilter = CIFilter.pdf417BarcodeGenerator()
            aFilter.message = Data(code.utf8)
            filter = aFilter
        case .aztecCode:
            let aFilter = CIFilter.aztecCodeGenerator()
            aFilter.message = Data(code.utf8)
            filter = aFilter
        }
    
        if let ciImage = filter.outputImage,
           let cgImage = context.createCGImage(ciImage, from: ciImage.extent) {
            self.init(cgImage, scale: 1, label: Text("BarCode"))
        } else {
            self.init(systemName: "xmark.circle")
        }
    
    }
}

使用

Image(code: "Test QR Code", .qrCode)
     .resizable()
     .interpolation(.none)
     .scaledToFit()