How to add ARKit AR Reference Images from the internet, on the fly.

For those looking for a quick answer, jump straight to practice. Props to BlackMirrorz for cracking it (here).

The Problem

To have a trackable AR Reference Image in ARKit you must add it to your assets bundle before building.

But what if you want to ‘platformize’ your AR content ? How do you handle that content and make sure it registers with ARKit?

Theory

First let’s analyze the existing image tracking functionality:

public func resetTracking() {
guard let referenceImages = ARReferenceImage.referenceImages(inGroupNamed: "AR Resources", bundle: nil) else {
fatalError("Missing expected asset catalog resources.")
}
let configuration = ARWorldTrackingConfiguration()
configuration.detectionImages = referenceImages;
configuration.maximumNumberOfTrackedImages = 1;
session.run(configuration, options: [.resetTracking, .removeExistingAnchors])
}

As you can see in the code above, the system grabs the AR Resources folder and converts them into ‘reference images’.

But what exactly are the reference images that are passed on?

The answer was right there.

Cool. So what the system needs is a set composed of one or more ARReferenceImage objects.

Solution

1. Load your images
2. Convert them to ARReferenceImage objects
3. Add them to your set
4. Reset tracking (to ensure it tracks the new images).

Practice

Start by loading the images

Code to load your image from a URL

Update your reset tracking to work from a custom set named ‘ReferenceImages’

Create the variable

var newReferenceImages:Set<ARReferenceImage> = Set<ARReferenceImage>();

Update reset tracking

public func resetTracking() {
let configuration = ARWorldTrackingConfiguration()
configuration.detectionImages = newReferenceImages;
configuration.maximumNumberOfTrackedImages = 1;
session.run(configuration, options: [.resetTracking, .removeExistingAnchors])
}

Then carry out the rest of the process

Heres the code for a single image — you can use it for many images.

self.loadImageFrom(url: URL(string: YOUR_URL)!) { (result) in

//SET YOUR IMAGE REAL WORLD WIDTH
let arImage = ARReferenceImage(result.cgImage!, orientation: CGImagePropertyOrientation.up, physicalWidth: YOUR_IMAGE_IS_PHYSICAL_WIDTH)
// SET YOUR IMAGE NAME
arImage.name = REFERENCE_IMAGE_NAME;
// APPEND TO REFERENCE IMAGES
newReferenceImages.insert(arImage);
// RESET TRACKING
self.resetTracking();
}

O.