NativeScript Augmented Reality

Tip: give this article by TJ a read if you want a nice introduction to AR in NativeScript. It uses an older version of the plugin, but it's still quite relevant.

Supported platforms

iPhone SE, 6s, iPad Pro, iPad 2017, or newer support ARKit. Running iOS 11 or newer.
Many Android devices support ARCore nowadays. Obviously the faster the device, the better the experience.

Installation

From the command prompt go to your app's root folder and execute:

tns plugin add nativescript-ar

Embedding an AR view

Types of AR experiences

World tracking: augment the world around you
Face tracking: augment a face
Image tracking: augment 2D images your camera finds

Using the AR API

AR API

Running the demos

To dive in quickly, install NativeScript if you don't have it yet: npm i -g nativescript, then clone this repo:

git clone https://github.com/EddyVerbruggen/nativescript-ar
cd nativescript-ar/src

In the src folder you'll find a package.json which has the commands to build and run these demos:

Solar System (Vue)

npm run demo.solarsystem.ios 
npm run demo.solarsystem.android

Pokémon (Angular)

npm run demo.pokemon.ios
npm run demo.pokemon.android

Glasses (Angular)

npm run demo.glasses.ios
npm run demo.glasses.android

TypeScript demo

This is just a kitchen sink demo with a lot of random stuff.

npm run demo.ios
npm run demo.android

JavaScript demo

This is a super simple demo which show how to integrate this plugin with plain JavaScript NativeScript apps.

npm run demo.plainjs.ios
npm run demo.plainjs.android