Reconocimiento de imágenes con ARKit

A partir de ARKit 1.5 ya podemos detectar imágenes 2D con la librería de realidad aumentada de Apple.

Además de la utilidad evidente de esta funcionalidad, al combinarla con la realidad aumentada se añade la facilidad de implementarla y la velocidad de su ejecución. Vamos a empezar paso a paso a ver como se implementa.

Suponemos que ya tenemos preparado nuestro proyecto para trabajar con ARKit, añadiendo a nuestra vista la escena y en nuestro info.plist los permisos necesarios. En este artículo podemos recordar cómo se hace.

Una vez hecho esto, tenemos que añadir en los assets un nuevo grupo llamado “AR Resource Group” donde tendremos las imágenes que queramos reconocer.

Añadimos en ese nuevo grupo creado las imágenes que queremos detectar y le damos sus medidas. Es importante que la imagen sea lo suficientemente reconocible, es decir, que tenga colores destacables. Además, tenemos que añadir su tamaño real (altura y anchura), siendo muy importante que sea el correcto para detectarlo lo más perfectamente posible. Por último, le damos un nombre que será el que nos devuelva al detectarlo, siendo esta la clave para identificarla.

Pasemos ya al código. En la configuración tenemos que añadir lo siguiente.

guard let referenceImages = ARReferenceImage.referenceImages(inGroupNamed: “AR Resources”, bundle: nil) else { return }
configuration.detectionImages = referenceImages

donde “AR Resources” será el nombre del grupo creado anteriormente.

Ahora indicamos que vamos a implementar el delegado ARSCNViewDelegate de nuestra escena

sceneView.delegate = self

E implementamos el siguiente método

func renderer(_ renderer: SCNSceneRenderer, didAdd node: SCNNode, for anchor: ARAnchor)

Para probar que funciona tan solo añadimos este código al método

guard let imageAnchor = anchor as? ARImageAnchor else { return }
let referenceImage = imageAnchor.referenceImage
debugPrint(referenceImage.name ?? “”)

donde vemos que primero nos aseguramos que el Anchor encontrado corresponde a una imagen detectada y pintamos por consola el nombre de la imagen.

¿Os funciona? Estupendo.

En esa variable ‘imageAnchor’ tenemos la posición de la imagen detectada, su altura y anchura, entre otras cosas, y lo podemos usar para añadir alguna información extra.

Siguiendo el ejemplo de Apple, vamos simplemente a pintar un plano sobre la imagen para indicar que la hemos detectado.

Para ellos añadimos este código en el delegado.

let plane = SCNPlane(width: referenceImage.physicalSize.width, height: referenceImage.physicalSize.height)
let planeNode = SCNNode(geometry: plane)
planeNode.opacity = 0.25
planeNode.eulerAngles.x = -.pi / 2
node.addChildNode(planeNode)

Como vemos utilizamos el tamaño físico (anchura y altura) para crear el plano y añadirlo al nodo donde está la imagen.

Y con esto ya estaríamos listo para utilizar esta útil funcionalidad.

Como vemos detecta cada imagen que hemos añadidos en AR Resources, en este caso solo una, pero cada vez que la detecta ejecuta la acción.

Aquí tenemos el código: https://github.com/alfonsomiranda/ARKitTutorial/tree/master/ARKitImageTutorial

Como ya dijimos anteriormente obtenemos su nombre y es la forma que tenemos de diferenciar las imágenes detectadas. Así podemos añadir cuantas imágenes queramos y al reconocer cada una hacer una acción distinta, y quedaría algo como esto.

En próximos artículos veremos como detectar otras cosas, como un QR o incluso objetos reales.