Показать камеру в приложении iOS с большей частью размытия экрана - PullRequest
Новая
       51

Показать камеру в приложении iOS с большей частью размытия экрана

0 голосов
/ 13 февраля 2020

Я хочу создать приложение iOS, которое сможет сканировать QR-коды через него. Я смог добавить logi c, который сканирует сам код, но у меня возникли проблемы с пользовательским интерфейсом этого экрана. Чего я хочу добиться, так это показать дисплей камеры в размытом режиме и иметь небольшой квадрат в центре экрана, который фактически показывает, что камера видит .

Давайте перейдем к некоторый код: 

class ScannerViewController: UIViewController, AVCaptureMetadataOutputObjectsDelegate {
    var captureSession: AVCaptureSession!
    var previewLayer: AVCaptureVideoPreviewLayer!

    override func viewDidLoad() {
        super.viewDidLoad()

        view.backgroundColor = UIColor.orange
        captureSession = AVCaptureSession()

        guard let videoDevice = AVCaptureDevice.default(for: .video),
            let deviceInput = try? AVCaptureDeviceInput(device: videoDevice) else {
                return
        }

        captureSession = AVCaptureSession()
        captureSession?.addInput(deviceInput)

        let captureMetadataOutput = AVCaptureMetadataOutput()
        captureSession?.addOutput(captureMetadataOutput)
        captureMetadataOutput.setMetadataObjectsDelegate(self, queue: DispatchQueue.main)
        captureMetadataOutput.metadataObjectTypes = [.qr]

        guard let captureSession = captureSession else { return }
        previewLayer = AVCaptureVideoPreviewLayer(session: captureSession)
        previewLayer.frame = CGRect(x: view.frame.width / 2 - 80, y: view.frame.height / 2 - 80, width: 160, height: 160)
        previewLayer.videoGravity = .resizeAspectFill
        view.layer.addSublayer(previewLayer)

        captureSession.startRunning()

    }
}

Этот код позволяет мне представить экран с оранжевым фоном, который имеет квадрат 160x160 в середине экрана, на котором будет отображаться камера, ищущая QR-коды. На устройстве это выглядит

Затем я обновил код, чтобы previewLayer.frame занял весь экран, и я могу добавить синий эффект: 

//      previewLayer.frame = CGRect(x: view.frame.width / 2 - 80, y: view.frame.height / 2 - 80, width: 160, height: 160)  
        previewLayer.frame = view.layer.bounds

        let blur = UIBlurEffect(style: .regular)
        let blurView = UIVisualEffectView(effect: blur)
        blurView.frame = self.view.bounds
        blurView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        self.view.addSubview(blurView)

Вот как это выглядит на второй версии .

Мой вопрос: как мне достичь сочетания обоих? Имея весь экран, показывающий размытость изображения с камеры, в то время как центр экрана представляет квадрат с четким представлением о том, что камера может сканировать? как то так

...