こんにちは。エクセルソフトの田淵です。
弊社取り扱いの Kudan AR SDK のエントリーです。
SDK のダウンロードは こちら からお申込みください。SDK を使った開発と、個人開発者のリリースは無料でご利用いただけます。企業の方は有料になりますので、@ytabuchi までご連絡ください。
現時点でのサンプルコードは ytabuchi の Github にアップしてあります。この後もコミット追加していくのでスナップショットです。
事前準備
まずは Kudan AR Framework をダウンロードします。
ダウンロードページで Developer License Key をメモしておいてください。
使用するマーカーやオブジェクトが含まれる Assets.zip は 弊社 Web サイト からダウンロードしておいてください。
プロジェクト作成
Empty Activity で Android プロジェクトを作成します。
作成する際に「Package name」 を com.xlsoft.kudanar に変更してください。
Kudan AR SDK のインポート
次にプロジェクトにダウンロードした KudanAR.aar をインポートします。
File＞New＞New Module を選択し、
Import .JAR/.AAR Package を選択します。
「File name」でダウンロードした KudanAR.aar を指定します。
そのままインポートされます。
Build.gradle (Modele: KudanAR) が作成されていて、中身が以下のようになっていることを確認してください。
configurations.maybeCreate("default")
artifacts.add("default", file('KudanAR.aar'))
IDE Error が出てインポートできない場合
Android Studio 3.1.1 などの特定のバージョンで aar がインポートできない不具合があるようです。以下を参考にしてください。
Android Studio 3.1.1 – unable to add module (import gradle project) – Stack Overflow
「Gradle Scripts」内の Settings.gradle を開き、以下のように KudanAR の参照を追加します。
include ':app', ':KudanAR'
保存すると表示される通知バーで Sync Now をクリックすると、プロジェクトに「Kudan AR」が読み込まれているはずです。
File＞Project Structure をクリックします。
左の項目から app を選択し、Dependencies をクリックして、左下の「＋」ボタンから「Module dependencies」を選択し、
「Kudan AR」を追加します。次の画像のように追加されていれば OK です。
次に進みましょう。
Android manifest 変更
まずは Permission の設定を追加します。
<uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.READ_PHONE_STATE" />
Activity のエレメントに以下を追加します。
android:configChanges="orientation|screenSize" android:screenOrientation="fullSensor"
現時点での Android.manifest は以下のようになっています。
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="eu.kudan.ar">
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity
android:name=".MainActivity"
android:configChanges="orientation|screenSize"
android:screenOrientation="fullSensor">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
Gradle 設定の変更
app の Gradle 設定（Build.gradle (Module: app)）の android ブロックに以下を追加します。
aaptOptions
{
noCompress 'KARMarker'
noCompress 'armodel'
}
また、dependencies ブロックにプロジェクトから KudanAR が参照できるように以下を追加します。
implementation project(':KudanAR')
現在の Build.gradle の全体は次のようになっています。
apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'
apply plugin: 'kotlin-android-extensions'
android {
compileSdkVersion 28
buildToolsVersion "29.0.2"
defaultConfig {
applicationId "com.xlsoft.kudanar"
minSdkVersion 21
targetSdkVersion 28
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
}
}
aaptOptions
{
noCompress 'KARMarker'
noCompress 'armodel'
}
}
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation"org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation project(':KudanAR')
}
プロジェクトの設定は以上です。
ARActivity を作る
無事 Kudan AR SDK が読み込めたので、Activity を作っていきます。
ARAPIkey の追加
まずは最初にメモっておいた API Key を追加します。
package com.xlsoft.kudanar
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import eu.kudan.kudan.ARAPIKey
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
// setContentView(R.layout.activity_main)
val key = ARAPIKey.getInstance()
key.setAPIKey("")
}
}
変更箇所は次の通りです。
import eu.kudan.kudan.ARAPIKeyを追加val key = ARAPIKey.getInstance()を追加key.setAPIKey("")を追加
- ここにコピーしたキーを入れてください。
次に ARActivity の設定です。
import eu.kudan.kudan.ARActivity を追加し、CompatiActivity から ARActivity に継承元を変更します。以下のようになります。
package eu.kudan.ar
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import eu.kudan.kudan.ARAPIKey
import eu.kudan.kudan.ARActivity
class MainActivity : ARActivity() {
...
}
続いて ARActivity の Setup メソッドを override します。以下を追加します。
override fun setup() {
// AR Content to be set up here
}
やっと Marker を読み込む準備ができました！！
が、その前にカメラのランタイムパーミッションを設定しましょう。
Permission 設定
クラスの下に以下の3つのメソッドを追加します。
// Permission のリクエストを OS 標準の requestPermissions メソッドで行う
private fun permissionsRequest(){
if (ContextCompat.checkSelfPermission(this,
Manifest.permission.INTERNET) != PackageManager.PERMISSION_GRANTED || ContextCompat.checkSelfPermission(this,
Manifest.permission.WRITE_EXTERNAL_STORAGE) != PackageManager.PERMISSION_GRANTED || ContextCompat.checkSelfPermission(this,
Manifest.permission.READ_EXTERNAL_STORAGE) != PackageManager.PERMISSION_GRANTED || ContextCompat.checkSelfPermission(this,
Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
ActivityCompat.requestPermissions(this,
arrayOf(Manifest.permission.INTERNET, Manifest.permission.WRITE_EXTERNAL_STORAGE, Manifest.permission.READ_EXTERNAL_STORAGE, Manifest.permission.CAMERA), 111)
}
}
// ダイアログを表示して、本サンプルアプリの設定画面に遷移する
private fun permissionsNotSelected() {
val builder = AlertDialog.Builder(this)
builder.setTitle("Permissions required")
builder.setMessage("Please enable the requested permissions in the app settings in order to use this demo app")
builder.setPositiveButton("Set permission", DialogInterface.OnClickListener { dialog, id ->
dialog.cancel()
val intent = Intent()
intent.action = Settings.ACTION_APPLICATION_DETAILS_SETTINGS
intent.data = Uri.parse("package:eu.kudan.ar")
startActivity(intent)
})
val noPermission = builder.create()
noPermission.show()
}
// requestPermissions ダイアログの結果を受け、全て許可されていなければ、permissionsNotSelected を呼び出し
override fun onRequestPermissionsResult(requestCode: Int, permissions: Array<String>, grantResults: IntArray) {
super.onRequestPermissionsResult(requestCode, permissions, grantResults)
when (requestCode) {
111 -> {
if (grantResults.isNotEmpty() &&
grantResults[0] == PackageManager.PERMISSION_GRANTED &&
grantResults[1] == PackageManager.PERMISSION_GRANTED &&
grantResults[2] == PackageManager.PERMISSION_GRANTED &&
grantResults[3] == PackageManager.PERMISSION_GRANTED) {
// パーミッションが必要な処理
} else {
permissionsNotSelected()
}
}
}
}
その後、onCreate メソッドに permissionRequest() を追加してください。
最終的な onCreate メソッドは以下のようになります。
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
val key = ARAPIKey.getInstance()
key.setAPIKey("")
permissionsRequest()
}
Marker を読み込む
ダウンロードした Assets.zip を展開して、Android Studio の Assets として読み込む必要があります。まずは 「File＞New＞Folder＞Assets Folder」 から Assets フォルダを作成します。
その際に必ず「Main」に作成してください。
Assets への画像のコピーですが、私は macOS の Finder で画像ファイルをコピーして Android Studio の Assets フォルダーでペーストしました。
画像をマーカーとして利用するには、ARImageTrackable オブジェクトを作成し、画像を読み込ませる必要があります。Setup 内に以下のコードを追加します。（ファイル名を lego.jpg にしています。）
override fun setup() {
super.setup()
// Initialise the image trackable and load the image.
val imageTrackable = ARImageTrackable("lego")
imageTrackable.loadFromAsset("lego.jpg")
// Get the single instance of the image tracker.
val imageTracker = ARImageTracker.getInstance()
imageTracker.initialise()
//Add the image trackable to the image tracker.
imageTracker.addTrackable(imageTrackable)
}
ImageNode をセットする
マーカーの上にオブジェクトを表示する方法はいくつかありますが、今回は画像を表示する ARImageNode を使用します。Setup 内に以下のコードを追加します。
// Initialise the image node with our image
val imageNode = ARImageNode("cow.png")
// Add the image node as a child of the trackable's world
imageTrackable.world.addChild(imageNode)
// imageNode のサイズを Trackable のサイズに合わせる
val textureMaterial = imageNode.material as ARTextureMaterial
val scale = imageTrackable.width / textureMaterial.texture.width
imageNode.scaleByUniform(scale)
デプロイ
お疲れ様でした。これで動作するはずですので、実機にデプロイしてみましょう！
Emulator は使えません
Kudan SDK のライブラリ aar は、現時点では armv7 のみ（32bit のみです…）の対応なので、x86 で動くエミュレーターでは動作しません。AR なので当たり前なのですがカメラも使いますので、実機にデプロイしてください。
こんな感じでマーカー上に cow.jpg が表示されていれば成功です！
この後は
次は動画や 3D オブジェクトを表示してみましょう。あ、先に iOS 用のクイックスタートをやるかも…笑
Kudan の製品概要やダウンロードは こちら からどうぞ。開発用の SDK で遊ぶ分には無料です。
Google Play にアップしたいな！って時も、個人開発者、年商1億円以内の会社であれば無料でご利用いただけます。（起動時に Kudan のスプラッシュスクリーンは表示されます。（Unity と同じ感じです））
Kudan AR SDK エントリー一覧
Kudan AR SDK チュートリアル記事まとめ | エクセルソフト ブログ
をご覧ください。
以上です。
