React Native Augmented Reality (AR)

Question

I'm investigating a couple of iOS/Android mobile apps for clients at the moment, that involve Augmented Reality:

1. The ability to preview what a piece of their furniture would look like in your home
2. A digital dressing room - preview what the clothes will look like in yourself

We primarily use React Native to build mobile apps (one of the projects would be building the feature into an existing React Native app).

Can anyone share their experience with React Native and AR? Share any links to frameworks/components that may help get started? Or simply lead some discussion around where to start?

Answer 1

It looks like React AR is yet to materialise. But there are already apps that implement certain libraries on top of React.

An example here.

Some JS libraries for AR include JSAruco and JSARToolKit. JSAruco is based on OpenCV and JSARToolkit is a port of ARToolkit via the in-between ports NyARToolkit (Java) and FLARToolkit (Actionscript). Some examples.

React VR is coming soon. Facebook announced alpha release of React VR, which is built on top of React Native, the tweet here.

1. The github page of framework
2. Sample projects and documentation of React VR here

EDIT

Ar.js is a new opensource js toolkit (based on three.js + jsartoolkit5) that looks very promising

UPDATE

Apple introduced ARKit with iOS 11 for iPhone and iPad, Here is a react native binding for the same. Find a curated list of awesome ARKit projects and resources here. 5 minutes example app

Resources

• react-native-live-translator - An augmented reality experiment in react native

• arcore-android-sdk - Google ARCore SDK for Android

• three.ar.js - A helper three.js library for building AR web experiences from Google

• ARKit-Sampler - Code examples for ARKit.

• React-AR - Augmented Reality with React (Work in progress)

• Expo AR - IOS only