Building a Simple ARKit Demo with SceneKit in Swift

Introduction

 

In this article, I will explain the ARKit basics with some examples. 

 

ARKit

 

ARKit integrates the iOS device camera and motion features to produce augmented reality experiences in your app or game. Augmented reality (AR) describes user experiences that add 2D or 3D elements to the live view from a device's camera, in a way that makes those elements appear to inhabit the real world. ARKit combines device motion tracking, camera scene capture, advanced scene processing, and display conveniences to simplify the task of building an AR experience. you can use these technologies to create many kinds of AR experiences, using the back camera or front camera of an iOS device.

 

Prerequisites

 

This article recommends that you should have a basic understanding of iOS development, and the basics of the ARKit framework.

 

To test out your ARKit app, you will need one of Apple's ARKit compatible devices, which are devices having Apple A9 processors or higher. Let's dive right in following points below:

• Creating a New Project for ARKit apps 
• Setting Up ARKit SceneKit View
• Connecting ARSCNView with View Controller
• Connecting IBOutlet
• Allowing Camera Usage
• Adding 3D Object to ARSCNView

Creating a New Project

 

In the Xcode menu, select File > New > Project ... Choose Single View App and press next. Xcode has the ARKit template but actually, you can just use the Single View App template to build an AR app. 

 

 

 

You can name your project name, whatever you want. I named my project world tracking demo, and press next create a new project.

 

Setting Up ARKit SceneKit View

 

Now open up main.storyboard. Look inside the object library for the ARKit SceneKit view. Drag the ARKit SceneKit view onto your view controller.

  

 

Connecting IBOutlet

 

On the Main.storyboard file, go up to the toolbar and open up the Assistant Editor. Add an import statement at the top of the HomeViewController.swift file to import ARKit.

 

Then, hold control and drag from the ARKit SceneKit View to the HomeViewContoller.swift file. When prompted, name the IBOutlet sceneView.

 

 

Configuration of ARSCNView Session

 

Now it's time to configure the ARKit SceneKit View. Insert the following code into the HomeViewConroller class. 

override func viewDidLoad() {
         super.viewDidLoad()
         let config = ARWorldTrackingConfiguration()
         config.planeDetection = .horizontal
         sceneView.debugOptions = [ARSCNDebugOptions.showFeaturePoints,ARSCNDebugOptions.showWorldOrigin]
         sceneView.delegate = self
         sceneView.session.run(config)
  }

In the above viewDidLoad() method, we initialized an AR configuration called ARWorldTrackingConfiguration. This is a configuration for running world tracking. What is world tracking? According to Apple's documentation:   

 

"World tracking provides 6 degrees of freedom tracking of the device. By finding feature points in the scene, world tracking enables performing hit-tests against the frame. Tracking can no longer be resumed once the session is paused." - Apple's Documentation

 

Allowing camera permission

 

Before we run our app, we need to get user permission that we will utilize their device's camera for augmented reality. So open up Info.plist. Right-click the blank area and choose Add row. Set the key to privacy, camera usage description. Set the value permission message.

 

 

Now you should be able to see your camera's view.

 

We have configured our sceneView's session to run the world tracking configuration.

 

Adding 3D Object to ARSCNView

 

We are going to add a 3D box on the sceneView, the code is shown below:

func addBox(){
    let box = SCNBox(width: 0.1, height: 0.1, length: 0.1, chamferRadius: 0)
    let material = SCNMaterial()
    material.diffuse.contents = UIColor.white
    material.diffuse.contents = #imageLiteral(resourceName: "C#Cornerlogo")
    box.materials = [material]
    let boxNode = SCNNode()
    boxNode.geometry = box
    boxNode.position = SCNVector3(0, 0, -0.2)
    let scene = SCNScene()
    scene.rootNode.addChildNode(boxNode)
    sceneView.scene = scene
}

Now add box that's called from the viewdidLoad() method.

override func viewDidLoad() {
       super.viewDidLoad()
       let config = ARWorldTrackingConfiguration()
       sceneView.session.run(config)
       addBox()

Build and run the app, and you will able to see a floating 3D box.

 

  

Thanks, Cheers!! Happy Coding!!