Xcode VisionKit으로 문서 스캔하고 결과 확인하기(feat.Page Control)

애플 기본 메모장 어플리케이션에는 문서 스캔 기능이 있습니다.

자동으로 문서를 인식해서 촬영해주는 기능도 있습니다.

이런 기능을 제공하는 것이 바로 애플의 VisionKit입니다.

 

Xcode 시뮬레이터는 카메라를 지원하지 않기 때문에,

카메라를 켜서 사진을 찍는 과정이 필요한 VisionKit 개발 테스트에는

휴대폰을 연결하고 진행을 해야 합니다.

 

저희는 간단하게 버튼을 눌러서 문서 스캔을 진행하고,

그 진행한 결과를 image View에 나타내보겠습니다.(전체 코드는 가장 하단에 있습니다)

 

이때 스캔을 해보면 아시겠지만, 여러장(아마 최대 20장..?)까지 되기 때문에

page Control를(https://moonibot.tistory.com/29)여기서 참고했습니다.

page control은 부가적인 요소이기 때문에, 따로 코드 설명은 하지 않고 넘어가겠습니다.

 

기본 화면 구성

간단하게 문서 스캔하기 버튼, Image View, 그리고 Page Control을 넣어주었습니다.

 

그리고 본격적으로 Vision kit을 사용해봅시다.

가장 중요한 건 import VisionKit 과 VNDocumentCameraViewControllerDelegate 입니다. 

 

 

quick help이나 developer document로 확인해보면 이건 프로토콜이라는 걸 확인할 수 있습니다.

 

그럼 이제 버튼을 눌렀을때 카메라 화면을 띄우고 스캔을 해보겠습니다.

그 전에!! 카메라를 사용한다는 건 사용자의 허락이 있어야 하기 때문에

Info.plist에서 카메라 사용 허가를 해야합니다.

 

'Privacy - Camera Usage~'를 클릭해주시고 Value에 안내창에 띄울 내용을 입력합니다.

 

안내창에 뜨게 되는 문구를 입력하는겁니다.

 

 

그럼 이제 버튼을 누르게 되는 Action 함수에서 스캔 기능 + 카메라를 활성화 해 봅시다.

 

버튼 액션 함수

호출되는 함수

 

보기 깔끔하기 위해서 visionKit이라는 함수를 따로 만들어서 호출해주었는데요,

scan.delegate나 present는 공식 문서에서 시키는대로 해주었습니다.

 

이렇게 하면 된다!

 

이렇게 하면 함수 이름에서도 알 수 있듯 present만 해준겁니다.

그럼 모든 문서를 스캔하고 완료했을때 호출할 함수가 또 필요하겠죠.

 

그게 바로

 

이 함수입니다. 

 

아래에 보시면 dismiss가 있다는 것도 확인할 수 있습니다.

이 함수는 우리가 직접 호출하는 게 아니라 스캔이 끝나고 'Save'버튼을 휴대폰에서 누르면

자동으로 호출되는 함수입니다.

 

그럼 모든 게 끝났습니다! 전체 코드는 접어둘테니 필요하신 분들은 확인해보세요.

 

//
//  ViewController.swift
//  VisionKit_Test
//
//  Created by Nayeon Kim on 2021/08/15.
//

import UIKit
import VisionKit

class ViewController: UIViewController, VNDocumentCameraViewControllerDelegate {

    @IBOutlet weak var scanButton: UIButton!
    @IBOutlet weak var imageView: UIImageView!
    @IBOutlet weak var pageControl: UIPageControl!
    
    var images:Array<Any> = []
    //비어 있는 Any 타입 배열. 여기에 스캔한 이미지들을 저장할 것임.
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func buttonPressed(_ sender: Any) {
        images = [] //처음에 '스캔하기' 버튼을 누르면 초기화 시켜 새로운 값을 저장
        visionKit()
    }
    
    @IBAction func pageChanged(_ sender: Any) {
        //페이지 컨트롤을 누르게 되어서 페이지가 바뀌게 되면 호출되는 함수
        
        imageView.image = (images[pageControl.currentPage] as! UIImage) //해당 페이지 (ex.2)에 맞는 images[2] 이미지를 불러옴
    }
    
    
    private func visionKit(){
        let scan = VNDocumentCameraViewController() //컨트롤러
        scan.delegate = self
        self.present(scan, animated: true, completion: nil)
    }
    
    func documentCameraViewController(_ controller: VNDocumentCameraViewController, didFinishWith scan: VNDocumentCameraScan) {
        for pageNumber in 0..<scan.pageCount { //스캔한 문서 수를 세서 그 갯수동안 for문 돌기
            let image = scan.imageOfPage(at: pageNumber)
            images.append(image) //images 배열에 스캔한 이미지들 하나씩 저장
        }
        
        pageControl.numberOfPages = images.count
        pageControl.currentPage = 0
        imageView.image = (images[0] as! UIImage) //첫 이미지 넘겨주기
        
        controller.dismiss(animated: true, completion: nil)
    }
}

 

 

<결과물>

총 두 개 이미지 스캔 시

 

질문사항이나 잘못된 부분이 있으면 댓글 남겨주세요!

감사합니다 :)