Native Android

Embedding TutAR 3D viewer in a native Android app

Prerequisites

• This guide expects basic Android development knowledge with kotlin

• Get a Connect3D Vendor Account from TutAR by sending a mail at <[email protected]>.

• Generate an API key from the Connect3D dashboard

Getting User Permissions

The AR functionality in the viewer requires Camera access, Make sure to take camera permission from the user.

AndroidManifest.xml

<manifest>
<!--
rest of the code
-->
    <uses-feature android:name="android.hardware.camera" android:required="false" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.webkit.PermissionRequest" />
    <uses-permission android:name="android.permission.INTERNET" />

<manifest>

override fun onCreate(savedInstanceState: Bundle?) {
// rest of the code
    if (ContextCompat.checkSelfPermission(this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
        ActivityCompat.requestPermissions(this, arrayOf(Manifest.permission.CAMERA), MY_PERMISSIONS_CAMERA)
    } 
}

Embedding the Viewer

Refer the below example implementation using the native webkit.WebView

res/layout/main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</LinearLayout>

MainActivity.kt

// Example Implementation
package com.tutar.embed

import android.Manifest
import android.app.Activity
import android.content.pm.PackageManager
import android.os.Bundle
import android.webkit.PermissionRequest
import android.webkit.WebChromeClient
import android.webkit.WebSettings
import android.webkit.WebView
import android.webkit.WebViewClient
import androidx.core.app.ActivityCompat
import androidx.core.content.ContextCompat

class MainActivity : Activity() {
    private val MY_PERMISSIONS_CAMERA = 1
    private lateinit var webView: WebView
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.main_activity)
        webView = findViewById(R.id.webview)
        webView.webViewClient = WebViewClient()

        val webSettings: WebSettings = webView.settings
        // these settings are required
        webSettings.javaScriptEnabled = true
        webSettings.domStorageEnabled = true
        webSettings.mediaPlaybackRequiresUserGesture = false

        if (ContextCompat.checkSelfPermission(this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
            ActivityCompat.requestPermissions(this, arrayOf(Manifest.permission.CAMERA), MY_PERMISSIONS_CAMERA)
        }   
        webView.webChromeClient = object : WebChromeClient() {
            override fun onPermissionRequest(request: PermissionRequest) {
                request.grant(request.resources)
            }
        }
        webView.loadUrl("https://web.tutar.app?api-key=<API-KEY>&user-id=<USER-ID>")
    }
}