在QR码iOS中间叠加图片

时间:2018-06-28 02:36:51

标签: ios uikit qr-code core-image

我正在将图像叠加到生成的qr代码上。 但是,当我尝试将位置图像更改为中心时,它不会移动到中心,但是会移动到另一个位置。

这是我的二维码

 let overlayImage = UIImage(named: "asdasd")
    var overlayImageView = UIImageView(image: overlayImage)


    var QRCodeImage: CIImage!

    var barcodeImage: CIImage!

    func generateQRCode(from string:String) -> UIImage? {

        let data =  string.data(using: String.Encoding.isoLatin1)

        if let filter = CIFilter(name:"CIQRCodeGenerator") {
            filter.setValue(data, forKey: "inputMessage")
            let transform = CGAffineTransform(scaleX: 100, y: 100)

            if let output = filter.outputImage?.transformed(by: transform) {


                return UIImage(ciImage: output)
            }
        }
        return nil
    }

这是显示重叠图像和二维码的代码

     if (QRCodeImage == nil && barcodeImage == nil) {

            if let actualText = QRText.text {


                let imageQRCode = generateQRCode(from: actualText)
                let imageBarcode = generateBarcode(from: actualText)


                overlayImageView.frame = CGRect(x: 0, y: 0, width: 45, height: 45)
                overlayImageView.center = imgQRCode.center //////////
                overlayImageView.contentMode = .scaleAspectFill
                imgQRCode.addSubview(overlayImageView)




                var mainImageView = UIImageView(image:imageQRCode)
                mainImageView.addSubview(overlayImageView)


                imgQRCode.image = imageQRCode
                imgBarcode.image = imageBarcode


        }

我使用overlayImageView.center得到的结果是

location of image in the bottom of the qr code

1 个答案:

答案 0 :(得分:0)

尝试类似的方法,将其放置在视图内部。

UIImageView为中心的重要代码行如下:

overlayImageView.translatesAutoresizingMaskIntoConstraints = false
overlayImageView.contentMode = .center

qrCodeImageView.addSubview(overlayImageView)

let centerXConst = NSLayoutConstraint(item: overlayImageView, attribute: .centerX, relatedBy: .equal, toItem: qrCodeImageView, attribute: .centerX, multiplier: 1, constant: 0)
let centerYConst = NSLayoutConstraint(item: overlayImageView, attribute: .centerY, relatedBy: .equal, toItem: qrCodeImageView, attribute: .centerY, multiplier: 1, constant: 0)
NSLayoutConstraint.activate([centerXConst, centerYConst])

我使用这个确切的代码将图标放在QR代码的中心:

class ViewController: UIViewController {

    @IBOutlet weak var qrCodeImageView: UIImageView!
    var qrCodeImage: CIImage!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        let textField = "fooqarcode"
        let data = textField.data(using: String.Encoding.isoLatin1, allowLossyConversion: false)

        let filter = CIFilter(name: "CIQRCodeGenerator")

        filter?.setValue(data, forKey: "inputMessage")
        filter?.setValue("Q", forKey: "inputCorrectionLevel")

        qrCodeImage = (filter?.outputImage)!

        let scaleX = qrCodeImageView.frame.size.width / qrCodeImage.extent.size.width
        let scaleY = qrCodeImageView.frame.size.height / qrCodeImage.extent.size.height

        let transformedImage = qrCodeImage.transformed(by: CGAffineTransform(scaleX: scaleX, y: scaleY))
        qrCodeImageView.image = UIImage(ciImage: transformedImage)

        let overlayImageView = UIImageView(image: UIImage(named: "block.png"))
        overlayImageView.translatesAutoresizingMaskIntoConstraints = false
        overlayImageView.contentMode = .center

        qrCodeImageView.addSubview(overlayImageView)

        let centerXConst = NSLayoutConstraint(item: overlayImageView, attribute: .centerX, relatedBy: .equal, toItem: qrCodeImageView, attribute: .centerX, multiplier: 1, constant: 0)
        let centerYConst = NSLayoutConstraint(item: overlayImageView, attribute: .centerY, relatedBy: .equal, toItem: qrCodeImageView, attribute: .centerY, multiplier: 1, constant: 0)
        NSLayoutConstraint.activate([centerXConst, centerYConst])
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}

enter image description here

enter image description here