Kudan AR SDK で AR Android アプリを作ってみよう〜マーカーレスで床に画像を表示

こんにちは。エクセルソフトの田淵です。

弊社取り扱いの Kudan AR SDK のエントリーです。

SDK のダウンロードは こちら からお申込みください。SDK を使った開発と、個人開発者のリリースは無料でご利用いただけます。企業の方は有料になりますので、@ytabuchi までご連絡ください。

前回の Android のエントリーではマーカーの上に動画を表示させるところまでをやりました。

今回は遂にマーカレスです。

現時点でのサンプルコードは ytabuchi の Github にアップしてあります。この後もコミット追加していくのでスナップショットです。

作業の流れ

今までは最初の MainActivity で作業していたので、アクティビティを分けたいと思います。

こんな感じですね。

  • 今までのマーカーの処理を MarkerActivity に移動する
  • マーカーレスの処理を ArbiActivity に新規に作成する
  • MainActivity は図のようにアクティビティに移動するだけのアクティビティにする

が作業内容です。ちょっと長いです。

また、今回使用する画像一式は、こちら からダウンロードしてください。

マーカー処理を MarkerActivity に移動

最初は既存のコードを移動しましょう。

activity_marker.xml を作成

メイン画面から「Marker」ボタンをタップした後で遷移するページを用意します。

Layout で右クリックして、「New>Layout Resource file」でアクティビティを作成します。

内容は前回までで作成した activity_main.xml から移行しましょう。

以下のようになります。

MarkerActivity を作成

次に MarkerActivity を作成して、MainActivity にあったキーをセットする部分と permissionsRequest メソッドを残して、その他を移行していきます。

アクティビティを追加したら、AndroidManifest.xmlapplication 内に以下の activity を追加しましょう。

configChangesscreenOrientation はアクティビティ毎に書くべきなのかいまいち分かっていませんが、これで動作はします()。

マーカーレスの処理を ArbiActivity に追加

コードが別れたので、マーカーレス用の画面と処理を追加していきます。

activity_arbi.xml を作成

先ほどと同様に、Layout を右クリックして、activity_arbi.xml を作成します。

画面下にオブジェクトを表示するためのボタンを作成したいので、以下のように記述します。

ArbiActivity を作成

次に同様に ARActivity を継承した ArbiActivity を作成します。

ARActivity を継承しているので、setupoverride が必要です。

そのまま setup 内で呼び出される、画像を表示するノードを作成します。trackingNode は後で使用するのでクラス変数 private lateinit var trackingNode: ARImageNode として定義しています。

原理はまだ理解できていませんが、画像を読み込むと反転して回転された状態で表示されてしまうので、おまじない的に正しい向きに回転させています。

次にマーカーレスモードの View を作成します。

マーカーレスモードでは、ARArbiTrackARGyroPlaceManager を使用するため、2つのインスタンスを取得し、初期化しています。

ターゲットを ARGyroPlaceManager に追加して、最後に ARArbiTracktargetNode プロパティに指定すれば、起動時にターゲットが表示されます。

最後に表示するノード trackingNodeARArbiTrack に追加しています。前回までの記事と同じように、ノードをいくつか作っておけば、指定したノードの表示/非表示を切り替えられるのではないかと思いますので、次回試してみます。

そのままボタンの onClick イベントの処理を書いていきます。

ARArbiTrack のインスタンスに isTracking のプロパティがあるので、これでボタンのテキストと targetNodevisible を制御しています。trackingNode は、ARArbiTrack をスタート/ストップすると自動で表示/非表示されます。

さあ!完成です。

ArbiActivity は次のようになっています。

Activity を追加したので、AndroidManifest.xml への追加も忘れずにやっておきましょう。

MainActivity を移動するだけのアクティビティにする

MainActivity に必要なのは ARAPIKeysetAPIKey でキーをセットする部分とパーミッションの処理だけですので、それぞれ次のように修正します。

activity_main.xml

MainActivity

こんな感じで一度配置したら割とピタッと配置される感じを味わってみてください。

https://platform.twitter.com/widgets.js

この後は

次はマーカーモードと同じく、マーカーレスで 3D モデルを配置することにチャレンジしてみたいと思います。

Kudan AR SDK エントリー一覧

Kudan AR SDK チュートリアル記事まとめ | エクセルソフト ブログ

をご覧ください。

以上です。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする