Putting loading animation over VNDocumentViewController Swift

Question

Is it possible to put a loading animation over the VNDocumentViewController? As in, when the user presses the Save button, is there a way for me to somehow indicate that the Vision is processing the image and hasn't frozen? Right now, in my app, there is a long pause between the user pressing Save and the actual image being processed.Here is an example from another post of what I'm trying to create

Answer 1

Here is one example of adding a loading indicator using UIActivityIndicatorView().

startAnimating() to start the animation and stopAnimation() to stop the animation.

iOS - Display a progress indicator at the center of the screen rather than the view

guard let topWindow = UIApplication.shared.windows.last else {return}
let overlayView = UIView(frame: topWindow.bounds)
overlayView.backgroundColor = UIColor.clear
topWindow.addSubview(overlayView)
let hudView = UIActivityIndicatorView()
hudView.bounds = CGRect(x: 0, y: 0, width: 20, height: 20)
overlayView.addSubview(hudView)
hudView.center = overlayView.center
hudView.startAnimating()

Alternatively, you could look into using Cocoapod MBProgressHud

• https://cocoapods.org/pods/MBProgressHUD

Answer 2

There's a way you can extend a class in Swift that captures this problem well. The idea is you want a UIActivityIndicator in your VNDocumentCameraViewController. But we'd like that to be a part of every version of this we use. We could simply embed the DocumentVC's view into our current view and superimpose a UIActivityIndicator above it in the view stack, but that's pretty hacky. Here's a quick way we can extend any class and solve this problem

import VisionKit
import UIKit

extension VNDocumentCameraViewController {
    
    private struct LoadingContainer {
        static var loadingIndicator = UIActivityIndicatorView()
    }
    
    var loadingIndicator: UIActivityIndicatorView {
        return LoadingContainer.loadingIndicator
    }
    
    func animateLoadingIndicator() {
        if loadingIndicator.superview == nil {
            view.addSubview(loadingIndicator)

            //Setup your constraints through your favorite method
            //This constrains it to the very center of the controller
            loadingIndicator.frame = CGRect(
                x: view.frame.width / 2.0,
                y: view.frame.height / 2.0,
                width: 20,
                height: 20)

            //Setup additional state like color/etc here
            loadingIndicator.color = .white
        }
        loadingIndicator.startAnimating()
    }
    
    func stopAnimatingLoadingIndicator() {
        loadingIndicator.stopAnimating()
    }
}

The place we can call these functions are in the delegate methods for VNDocumentCameraViewController that you implement in your presenting ViewController:

func documentCameraViewController(
    _ controller: VNDocumentCameraViewController, 
    didFinishWith scan: VNDocumentCameraScan
) {
    controller.animateLoadingIndicator()
}