“Augmented reality (AR) is a live direct or indirect view of a physical, real-world environment whose elements are augmented (or supplemented) by computer-generated sensory input such as sound, video, graphics or GPS data. “ from wikipedia.
Wikitude SDK
Wikitude is AR solution SDK which provide image recognition,tracking, location based AR application & much more regarding AR application development. Wikitude SDK is free trail & Pro version available. Wikitude.
Wikitude provide two android SDK solution one is Java Script & another is NATIVE API -
comparison
start with Java Script SDK
- Download Java Script SDK from Wikitude
- Create Android application using Android Studio, uses-permission & uses-feature in AndroidManifest.xml
AndroidManifest.xm
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="me.dineshkarpe.hellowikitude"
android:versionCode="1"
android:versionName="1.0">
<uses-sdk
android:minSdkVersion="9"
android:targetSdkVersion="19" />
<uses-permission android:name=
"android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_GPS" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.BLUETOOTH" />
<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
<uses-feature
android:name="android.hardware.camera"
android:required="true" />
<uses-feature
android:name="android.hardware.location"
android:required="true" />
<uses-feature
android:name="android.hardware.sensor.accelerometer"
android:required="true" />
<uses-feature
android:name="android.hardware.sensor.compass"
android:required="true" />
<uses-feature
android:glEsVersion="0x00020000"
android:required="true" />
<application
android:allowBackup="true"
android:icon="@drawable/ic_action_name"
android:label="@string/app_name">
<activity
android:name="me.dineshkarpe.wikitude.HelloWikitude"
android:configChanges="screenSize"
android:icon="@drawable/ic_action_name"
android:label="@string/app_name"
android:theme="@style/AppTheme.NoActionBar">
android:screenOrientation="landscape">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>- Add wikitude sdk in andriod application
- Android studio create activity with default layout, in that layout add Wikitude component
package me.dineshkarpe.wikitude;
import android.Manifest;
import android.content.pm.PackageManager;
import android.os.Bundle;
import android.support.design.widget.Snackbar;
import android.support.v4.app.ActivityCompat;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.util.Log;
import android.view.View;
import com.wikitude.architect.ArchitectView;
import com.wikitude.architect.StartupConfiguration;
import java.io.IOException;
import me.dineshkarpe.hellowikitude.R;
/**
*
*/
public class HelloWikitude extends AppCompatActivity {
static final String TAG = HelloWikitude.class.getSimpleName();
private ArchitectView architectView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.hellowikitude);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
this.architectView = (ArchitectView)this.findViewById(R.id.architectView);
if(ActivityCompat.checkSelfPermission(HelloWikitude.this,
Manifest.permission.CAMERA)
!= PackageManager.PERMISSION_GRANTED){
if (ActivityCompat.shouldShowRequestPermissionRationale(HelloWikitude.this,
Manifest.permission.CAMERA)) {
// Show an expanation to the user *asynchronously* -- don't block
// this thread waiting for the user's response! After the user
// sees the explanation, try again to request the permission.
Log.i(TAG,
"Displaying camera permission rationale to provide additional context.");
Snackbar.make(architectView, "Camera permission is needed to show the camera preview.",
Snackbar.LENGTH_INDEFINITE)
.setAction("OK", new View.OnClickListener() {
@Override
public void onClick(View view) {
ActivityCompat.requestPermissions(HelloWikitude.this,
new String[]{Manifest.permission.CAMERA,Manifest.permission.BLUETOOTH},
0);
}
})
.show();
} else {
// No explanation needed, we can request the permission.
ActivityCompat.requestPermissions(this,
new String[]{Manifest.permission.CAMERA},
0);
// MY_PERMISSIONS_REQUEST_READ_CONTACTS is an
// app-defined int constant. The callback method gets the
// result of the request.
}
}else{
loadArchitectView();
}
}
@Override
public void onResume() {
try{
super.onResume();
this.architectView.onResume();
}catch (NullPointerException e){
}
}
@Override
protected void onStop() {
super.onStop();
}
@Override
protected void onDestroy() {
try{
super.onDestroy();
}catch (NullPointerException e){
}
}
@Override
protected void onPause() {
try{
super.onPause();
this.architectView.onResume();
this.architectView.onPause();
}catch (NullPointerException e){
}
}
@Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
}
@Override
public void onRequestPermissionsResult(int requestCode,
String permissions[], int[] grantResults) {
switch (requestCode) {
case 0: {
// If request is cancelled, the result arrays are empty.
if (grantResults.length > 0
&& grantResults[0] == PackageManager.PERMISSION_GRANTED) {
loadArchitectView();
} else {
// permission denied, boo! Disable the
// functionality that depends on this permission.
}
return;
}
// other 'case' lines to check for other
// permissions this app might request
}
}
private void loadArchitectView() {
final StartupConfiguration startupConfiguration = new StartupConfiguration(getApplicationContext().getString(R.string.wikitude_trial_licence_key));
this.architectView.onCreate(startupConfiguration);
this.architectView.onPostCreate();
try {
this.architectView.load("index.html");
}catch (IOException e){
}
this.architectView.callJavascript("loadLogin()");
this.architectView.callJavascript("loadWelcome()");
}
}- Now in Main activity initialize
- Now Override onRequestPermissionsResult() in main Activity.
- After user provide access camera Wikitude configuration come in the picture
private void loadArchitectView() {
final StartupConfiguration startupConfiguration = new StartupConfiguration(getApplicationContext().getString(R.string.wikitude_trial_licence_key));
this.architectView.onCreate(startupConfiguration); this.architectView.onPostCreate();
try {
this.architectView.load("index.html");
}
catch (IOException e){
}
this.architectView.callJavascript("loadLogin()");
this.architectView.callJavascript("loadWelcome()");
}How html & java script load with wikitude & android.
- Create asset folder in android studio project
try { this.architectView.load("index.html"); }catch (IOException e){ }- architectView.load() will load file from application’s assets folder and architectView.load(“path/index.html”) the index html-file in path, relative to the assets root directory, no need to use absolute assets-directory.
this.architectView.callJavascript("loadLogin()");
this.architectView.callJavascript("loadWelcome()");- architectView.callJavascript() will invoke java script function