OCR (SwiftUI)

Descripción General

El objetivo de este documento es proporcionar una guía detallada para desarrolladores sobre cómo integrar e implementar el SDK ModelOCRUI en aplicaciones iOS.
El SDK, desarrollado con SwiftUI, permite la captura y extracción de datos a través de reconocimiento óptico de caracteres (OCR) para las identificaciones permitidas, de forma eficiente en la plataforma iOS.

Funcionalidad de la librería

Al invocar el módulo de OCR, el SDK guiará paso a paso a los usuarios para capturar una identificación oficial. El flujo principal incluye:

1. Una pantalla inicial con instrucciones y recomendaciones para maximizar la calidad de captura.
2. La captura del frente de la identificación, y en caso de ser necesario, el reverso.
3. Una vez completada la captura, el flujo regresa a la aplicación anfitriona, devolviendo el control y los resultados obtenidos (imágenes en Base64 y JSON con datos relevantes).

Compatibilidad

Lenguaje	Versión mínima iOS
SwiftUI	iOS 18+

Incrustar y Firmar el Framework

1. En Xcode, ve a la pestaña General en el target de tu aplicación.
2. En la sección Frameworks, Libraries and Embedded Content, arrastra o agrega ModelOCRUI.xcframework.
3. En la columna Embed, selecciona Embed & Sign para este framework.

Requisitos Previos

1. Agrega la nueva versión de Microblink: Mediante el gestor de paquetes en Xcode, agrega la librería de Microblink como dependencia a partir de su versión 7 usando la siguiente url https://github.com/microblink/blinkid-ios.

2. Incrusta y firma la librería de BlinkIDUX en la sección Frameworks, Libraries and Embedded Content de la pestaña General en el target de tu aplicación y en la columna Embed, selecciona Embed & Sign para esta librería.

3. Permisos en Info.plist: Agrega las siguientes claves (obligatorias para usar la cámara/micrófono) en tu Info.plist:

<key>NSCameraUsageDescription</key>
<string>Por favor, concede permisos para el uso de la cámara. By Dicio</string>

2. Configuración del Proyecto: • En el archivo Swift donde lanzarás el flujo de OCR, importa el framework con:

import ModelOCRUI

Personalizar la Apariencia de la Interfaz

Para personalizar colores y logotipos en la interfaz de OCR, se provee la estructura DicioOCRUIConfig. Por ejemplo:

let configUI = DicioOCRUIConfig(
    loadLogo: String,
    assetLogo: String, 
    colorTitulo: String, 
    colorSubTitulo: String, 
    colorTextoBtn: String, 
    colorFondoBtn: String)

Nota

•   Los valores de color deben estar en formato hexadecimal (por ejemplo, #RRGGBB).
•   El logotipo (loadLogo y assetLogo) debe existir en tu Assets Catalog.
•   Todos los campos son obligatorios.

Iniciar el Proceso de OCR

1.  Token: La aplicación host debe recibir un token proporcionado por Dicio (vía backend u otro medio).
2.  URL: También se requiere la URL donde se realiza la verificación.
3.  Config: Se crea la instancia DicioOCRUIConfig con tus colores y logotipos.

Ejemplo de uso en SwiftUI

Imaginemos que en tu vista SwiftUI presentas una hoja o pantalla completa con el SDK. Podrías hacer:

.fullScreenCover(isPresented: $showOCRFramework) {
    let ocrConfig = DicioOCRUIConfig(
        loadLogo: "logoSeleccionado",
        assetLogo: "logoSeleccionado",
        colorTitulo: "#4D21B2",
        colorSubTitulo: "#707070",
        colorTextoBtn: "#B18CFE",
        colorFondoBtn: "#2B0877"
    )

    DicioOCRVCUI(
        token: "TOKEN_PROPORCIONADO_POR_DICIO",
        urlVerify: "https://ejemplo.servicio.com",
        config: ocrConfig,
        delegateDicioOCR: self
    )
}

De esta forma, cuando showOCRFramework sea true, se mostrará tu flujo de OCR.

Implementación del Protocolo

Para recibir los resultados del OCR (JSON, imágenes, etc.) y controlar el cierre del SDK, se usa el protocolo DicioScanOCRDelegate.

Declara tu vista (o controlador) como delegada

struct configModelOCR: View, DicioScanOCRDelegate {
    // ...
}

Métodos Requeridos

1. imagesID:
   • Descripción: Se invoca una vez finalizada la captura de la identificación, retornando imágenes en base64.
   • Implementación::

   func imagesID(userIDPic: String, userIDFront: String, userIDBack: String)
   • userIDPic: Foto recortada del rostro en la identificación. • userIDFront: Imagen de la cara frontal en Base64. • userIDBack: Imagen del reverso en Base64.

2. finishOCRView:

   • Descripción: Se invoca para cerrar el flujo del SDK.
   • Implementación::

   func finishOCRView()

   En este método, típicamente cierras la pantalla que estaba presentando el SDK. Por ejemplo, en SwiftUI podrías cambiar un @State para hacer dismiss(). Si estuvieras en UIKit, harías:

   • Implementación:

     DispatchQueue.main.async {
         if self.navigationController != nil {
             self.navigationController?.popViewController(animated: true)
         } else {
             self.dismiss(animated: true, completion: nil)
         }
     }

3. ocrDicioResults:

   • Descripción: Se invoca cuando la verificación de OCR es exitosa o finaliza.
   • Implementación::

   func ocrDicioResults(
   ocr: String, 
   isSuccessfull: Bool, 
   info: String, 
   tipoID: String)
   • Parámetros:
     • ocr: String: Cadena en formato JSON con la información extraída.
     • isSuccessfull: Bool: Indica si el flujo terminó con éxito.
     • info: String: Mensaje o descripción adicional.
     • tipoID: String: Tipo de identificación detectada.

Ejemplo Completo de Integración

Imagina que tu vista SwiftUI se llama configModelOCR. Adopta el protocolo DicioScanOCRDelegate y en algún botón presentas la hoja con DicioOCRVCUI. Ejemplo:

struct configModelOCR: View, DicioScanOCRDelegate {
    @State private var showOCRFramework = false

    // MARK: - DicioScanOCRDelegate
    func imagesID(userIDPic: String, userIDFront: String, userIDBack: String) {
        // Aquí puedes procesar las imágenes base64
    }

    func finishOCRView() {
        // Cerrar la pantalla que contiene el SDK
        showOCRFramework = false
    }

    func ocrDicioResults(ocr: String, isSuccessfull: Bool, info: String, tipoID: String) {
        // Guardar o procesar la info JSON
    }

    var body: some View {
        Button("Lanzar OCR") {
            showOCRFramework = true
        }
        .fullScreenCover(isPresented: $showOCRFramework) {
            let configUI = DicioOCRUIConfig(
                loadLogo: "MiLogo",
                assetLogo: "MiLogo",
                colorTitulo: "#4D21B2",
                colorSubTitulo: "#707070",
                colorTextoBtn: "#B18CFE",
                colorFondoBtn: "#2B0877"
            )

            DicioOCRVCUI(
                token: "TOKEN_PROPORCIONADO_POR_DICIO",
                urlVerify: "https://ejemplo.servicio.com",
                config: configUI,
                delegateDicioOCR: self
            )
        }
    }
}

Con esto, tu app host abrirá el SDK cuando presione el botón. Al terminar el flujo (correcto o cancelado), el SDK llamará a finishOCRView(), y tu vista quitará la presentación.

Conclusiones

•   ModelOCRUI facilita la captura de identificaciones oficiales mediante Microblink dentro de SwiftUI.
•   Asegúrate de colocar los permisos Camera y Microphone en el Info.plist.
•   Personaliza la interfaz de OCR con DicioOCRUIConfig.
•   Implementa DicioScanOCRDelegate para manejar resultados (imágenes, JSON) y el cierre del SDK.

Consideraciones Adicionales

• Manejo de Errores: El SDK internamente maneja casos de permisos denegados o token no autorizado. En caso de que el usuario deniegue la cámara o micrófono, se le mostrará una alerta indicándole que debe conceder permisos.

• Estilos y UI: Puedes personalizar la presentación (por ejemplo, usar .sheet en lugar de .fullScreenCover), siempre que el contenedor sea una vista SwiftUI.

• Integración en Proyectos Existentes: Asegúrate de que tu proyecto cumpla con iOS 13+ (o la versión que hayas definido). Para versiones anteriores, este SDK no es compatible.

• Versionado: Verifica la versión específica de VideoRecorderUI.xcframework que recibas, en caso de que existan actualizaciones o cambios en la API.