Unlimited Handを折角なのでARと連動させようと思い、ARサービスを探していたところ(※)、表題の「PanicAR」が見つかりました。
※ マーカー連動型ARだと、いちいちマーカーを用意しないとならなかったので、今回はPOI(Point Of Interests)をサポートしているARサービス

こちらのARサービスの利点は「Android - Viewの知識だけでとりあえずPOIを表示することができる」になるかと思います。
他にもWikitudeもPOIをサポートしていましたが、Native API版ではサポートしてなくJavaScript API版を使う必要があり抵抗がありましたが、PanicARはその点の負荷が抑えられるので助かります。
導入に関しても、"PanicAR Demo"と表示されても気にならないのであれば、無料で機能を試すことができます。

PanicARを使用した最小構成のアプリは以下のようになります。


この構成を作成するための手順は以下のようになります。
  1. ここからGitでプロジェクトをクローンする。
  2. アプリ用のプロジェクトをAndroid Studioで作成。
  3. デフォルトで作成される「app」モジュールのbuild.gradleを開き、クローンしたPanicARのプロジェクト内の「Framework/libs」内の2つのjarファイル(PanicARKit.jar、PanicSensorKit.jar)を引き込む。
  4. 例:作成したプロジェクトのトップフォルダとPanicARのプロジェクトが同じフォルダに存在している場合
    dependencies {
        compile fileTree(include: ['*.jar'], dir: '../../PanicAR-android/Framework/libs')    // これを追加
    }
    
  5. Applicationは「com.dopanic.panicsensorkit.PARApplication」を継承したクラスである必要がある
  6. public class ARandUHApplication extends PARApplication {
        @Override
        public String setApiKey() {
            return "";  // 本当は取得したライセンスキーを設定する必要があるが、なくても動作検証は可能
        }
    }
    
  7. 以下のPermission、FeatureをAndroid Manifestにて宣言。
  8.     <uses-feature
            android:name="android.hardware.camera"
            android:required="false" />
        <uses-feature android:name="android.hardware.camera.autofocus" />
    
        <uses-permission android:name="android.permission.INTERNET" />
        <uses-permission android:name="android.permission.CAMERA" />
        <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
        <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
        <uses-permission android:name="android.permission.ACCESS_MOCK_LOCATION" />
        <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
        <uses-permission android:name="android.permission.VIBRATE" />
    
  9. 先に貼った画像の構成を実装します。注意点としては以下のようになります。(番号は先の画像内の番号になります)
  10. 番号概要サンプルコード
    • PanicARを動作させるために必要なFragment。「com.dopanic.panicarkit.lib.PARFragment」を継承している必要がある。
    • 継承したクラスのonCreateViewにて、super.onCreateViewをコールする前にフィールド「viewLayoutId」にそのFragment向けのレイアウト(リソースID)を設定しておく必要がある
    • ※ 設定していないとリソースID「0x00」のリソースを展開しようとして例外が発生する。
    public class MainArFragment extends PARFragment {
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
            this.viewLayoutId = R.layout.fragment_main;  // Fragmentに設定したいレイアウト用のリソースIDを設定
            return super.onCreateView(inflater, container, savedInstanceState);
        }
    }
    
    • PARCameraViewやPARViewを管理している親View。「android.widget.RelativeLayout」か、それを継承したクラスである必要がある。
    • tagに"arMainLayout"が設定されている必要がある。
    • ただし、ルートViewである必要はない。
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:tag="arMainLayout"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent">
    
        <com.dopanic.panicarkit.lib.PARCameraView
            android:id="@+id/arCameraView"
            android:tag="arCameraView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"/>
    
        <com.dopanic.panicarkit.lib.PARView
            android:id="@+id/arContentView"
            android:tag="arContentView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    
        <com.dopanic.panicarkit.lib.PARRadarView
            android:layout_width="64dp"
            android:layout_height="64dp"
            android:gravity="center"
            android:background="@drawable/radar_screen"
            android:id="@+id/arRadarView"
            android:tag="arRadarView"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true" />
    
    </RelativeLayout>
    
    • 「com.dopanic.panicarkit.lib.PARCameraView」か、それを継承したクラス。このクラスにカメラから入力した現実世界を表示する。
    • tagに"arCameraView"が設定されている必要がある。
    • 「com.dopanic.panicarkit.lib.PARView」か、それを継承したクラス。このクラスにアプリで追加したPOIが表示される。
    • tagに"arContentView"が設定されている必要がある。
    • 「com.dopanic.panicarkit.lib.PARRadarView」か、それを継承したクラス。POIの位置を表示するレーダーとして使用されるもので、無くても動作可能
    • 使用する際、tagに"arRadarView"を設定しておく必要がある。
    • 「com.dopanic.panicarkit.lib.PARPoi」か、それを継承したクラス。
    • POI毎にインスタンス化して追加する必要がある。
    • PARRadarViewにPOIの位置を表示したい場合、表示する画像リソースのリソースIDをフィールド「radarResourceId」に設定する必要がある。
    • POI向けのViewをcreateViewをオーバーライドした中で作成し、フィールド「_labelView」に設定しておく必要がある。
    • 本インスタンスを「com.dopanic.panicarkit.lib.PARController」に追加することでPOIが表示される。
    public class POIImageView extends PARPoi {
        public POIImageView(Location atLocation) {
            super(atLocation);
            this.radarResourceId = R.drawable.radar_dot;  // レーダー内で表示する画像リソースの設定
        }
    
        @Override
        public void createView() {
            super.createView();
    
            LayoutInflater inflater = (LayoutInflater) ctx.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            _labelView = (RelativeLayout) inflater.inflate(R.layout.poi_imageview, null, false);
        }
    
    }
    

上記のような実装を行うことでARを表示することができます。ただ、まとめていて気づいたのですが、ApplicationインスタンスをPARApplicationの派生クラスにしないとならない点により、MultiDexApplicationを使用できなくしてしまうことが気になりました。。。
サンプルアプリはこちらを参照してください。

コメントの投稿