The Viro Developer Hub

Welcome to the Viro developer hub. You'll find comprehensive guides and sample code to help you start working with Viro as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started

Enable ARKit 2.0 (Beta) Features

Xcode Beta and a Paid Apple Developer account is required to use ARKit 2.0 Features

Due to App Store restrictions, we can not release a Testbed application with ARKit 2.0 Features, as a result, to use ARKit 2.0 Features, you'll need to follow the instructions below to setup your device and Xcode Beta to build your application.

Have you already set up Xcode?

Run through all the steps in the Set up Xcode with ViroReact guide before running through this one.

1. Install Xcode Beta

Go to this link and install Xcode 10 Beta: https://developer.apple.com/xcode/downloads/

2. Install iOS 12.0 Beta on your Device

If you do this, you can no longer install to the device using previous versions of Xcode (non-Beta).

On your iOS device, navigate to this page: https://developer.apple.com/download/ and install the Configuration Profile for iOS 12.0 Beta

3. Download the zipped npm package (.tgz) from here:

Version
Date
Link

4. Install the downloaded npm package

cd </path/to/workspace/>
npm install react-viro-<version>.tgz

5. Update rn-cli.config.js

<workspace>/rn-cli.config.js:

Add "arobject" to getAssetExts()

6. Update RCTWebSocket Project

RCTWebSocket Target -> Build Phases -> Link Binary With Libraries and replace the unresolved libfishhook.a with the correct one under RCTWebSocket.xcodeproj -> Products

from: https://github.com/facebook/react-native/issues/19569

7. Check out the new API's:

ViroARObjectMarker

This component has the exact same signature as ViroARImageMarker but its target uses the new "Object" target type.

To declare/create an "Object" target, use ViroARTrackingTargets like so:

ViroARTrackingTargets.createTargets({
  coke_can : { // an Object Target
    source : require('./res/coke_can.arobject'),
    type : 'Object',
  },
  starry_night : { // an Image Target
    source : require('./res/starry_night.jpg'),
    orientation : "Up",
    physicalWidth : 0.189,
  }
})

You can create an .arobject file through the instructions here (download the sample app, build it, scan your object, and send it to your computer):
https://developer.apple.com/documentation/arkit/scanning_and_detecting_3d_objects?language=objc

Continuous Image Tracking

ARKit introduced a new API that enables continuous Image Tracking vs, what they now refer to as, Image Detection.

This is exposed in ViroARSceneNavigator's new numberOfTrackedImages property which takes in a number of images that should be tracked concurrently. For example, if this number is set to 3, then the first 3 images visible in a scene will be tracked. Even if there are 5 total ViroARImageMarkers only the first 3 will be tracked, if one marker leaves the view, then an untracked marker will then be tracked. Keep in mind that this number should be kept low as the higher the number, the worse the performance.

Enable ARKit 2.0 (Beta) Features


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.