[ReactVR] Render Custom 3D Objects Using the Model Component in React VR

React VR isn't limited to simple 3D primitives. By using the <Model/> Component we can place a complex 3D models into our scene.

 

import React from 'react';
import {
  AppRegistry,
  asset,
  Pano,
  Text,
  View,
  Image,
  Model,
  Sphere,
  PointLight,
  AmbientLight,
  DirectionalLight,
} from 'react-vr';

export default class app extends React.Component {
  render() {
    return (
      <View>
        <DirectionalLight
          intensity={5} 
          style={{
            transform: [{translateZ: -1}]
          }}
        />
        <Model
          source={{
            obj: asset('girl.obj')
          }}
          style={{
            color: 'white',
            transform: [{translate: [0, -10, -30]}]
          }}
          lit
        />
    </View>
    );
  }
};

AppRegistry.registerComponent('app', () => app);