Poly API：VRおよびAR Androidアプリの3Dアセットの取得

コンテンツ

Polyを使用した3Dアセットの表示
3Dモデリングプロジェクトの作成
Google Cloud Platformアカウントを作成します
Poly APIキーを取得する
プロジェクトの依存関係：Fuel、P3D、Kotlin拡張機能
APIキーを追加する
資産の取得
2番目の画面の作成：ナビゲーションの追加
3Dキャンバスの構築
P3Dのキャンバスに描く
プロジェクトをテストする
まとめ
関連する

バーチャルリアリティ（VR）または拡張現実（AR）モバイルアプリの素晴らしいアイデアはありますが、ビジョンを実現する方法はわかりませんか？

経験豊富な3DアーティストでもあるAndroid開発者でない限り、没入感のある360度のエクスペリエンスを提供するために必要なすべてのアセットを作成するのは困難なプロセスです。

3Dモデルの作成に必要な時間、リソース、または経験がないため、 しません 優れたVRまたはARモバイルアプリを構築できないことを意味します。 World Wide Webで自由に利用できる3Dリソースの膨大な範囲に加え、Androidアプリケーションでこれらのアセットをダウンロードしてレンダリングするために必要なすべてのAPI、フレームワーク、ライブラリがあります。

次を読む：Daydream VRを使用して任意のWebサイトにアクセスできるようになりました。あれも。

この記事では、数千の3Dアセットを簡単に使用できるオンラインリポジトリおよびAPIであるPolyについて説明します。この記事の終わりまでに、実行時に3D Polyアセットを取得し、一般的なProcessing for Androidライブラリを使用してレンダリングするアプリを作成しました。

Polyを使用した3Dアセットの表示

Unity開発に手を出したことがある場合、PolyリポジトリはUnity Asset Storeに似ていますが、Polyのすべてが無料である点が異なります。

Polyの3Dモデルの多くはCreative Commonsライセンスの下で公開されているため、作成者に適切なクレジットを与えれば、これらのアセットを自由に使用、変更、リミックスできます。

Polyの3Dモデルはすべて、DaydreamやARCoreなど、GoogleのVRおよびARプラットフォームと互換性があるように設計されていますが、どこでも好きなときに使用できます。場合によっては、AppleのARKitでも使用できます。

Polyアセットの取得と表示に関しては、2つのオプションがあります。まず、アセットをコンピューターにダウンロードしてからAndroid Studioにインポートし、アプリケーションに付属してAPKサイズに貢献するようにするか、Poly APIを使用して実行時にこれらのアセットを取得できます。

クロスプラットフォームのRESTベースのPoly APIは、Polyの膨大な3Dモデルのコレクションへのプログラムによる読み取り専用アクセスを提供します。これは、APKにアセットをバンドルするよりも複雑ですが、実行時にPolyアセットを取得することにはいくつかの利点があります。最も顕著なのは、APKサイズを制御しやすくすることです。

また、Poly APIを使用してユーザーに選択肢を提供することもできます。たとえば、モバイルゲームを開発している場合、ユーザーにさまざまなキャラクターモデルから選択させることができます。

Polyモデルは自由に変更できるため、髪や目の色を変更したり、さまざまな武器や防具などの他のPolyアセットと組み合わせたりして、選択したキャラクターをユーザーに微調整させることもできます。このように、Poly APIを使用すると、印象的な3Dアセットを提供でき、エクスペリエンスをパーソナライズするための多くの範囲があり、すべてが比較的少ない作業でできます。ユーザーは、これらすべての3Dモデルを細心の注意を払って作成し、膨大な時間を費やしたことを確信します。

3Dモデリングプロジェクトの作成

アプリケーションを最初に起動したときに特定のPolyアセットを取得し、ユーザーのリクエストに応じてそのアセットをフルスクリーンモードで表示するアプリケーションを作成します。

このアセットの取得を支援するために、KotlinおよびAndroid用のHTTPネットワーキングライブラリであるFuelを使用します。選択した設定で新しいプロジェクトを作成することから始めますが、プロンプトが表示されたら「Kotlinサポートを含める」を選択します。

Poly APIに対して行うすべての呼び出しには、アプリの識別と使用制限の実施に使用されるAPIキーが含まれている必要があります。開発およびテスト中は、多くの場合、無制限のAPIキーを使用しますが、このアプリをリリースする予定がある場合は、Android制限のAPIキーを使用する必要があります。

制限付きキーを作成するには、プロジェクトのSHA-1署名証明書を知っている必要があります。次の情報を取得しましょう。

Android Studioの[Gradle]タブを選択します（次のスクリーンショットのカーソルがあります）。これにより、「Gradle projects」パネルが開きます。

「Gradle projects」パネルで、プロジェクトの「root」をダブルクリックして展開し、「Tasks> Android> Signing Report」を選択します。これにより、Android Studioウィンドウの下部に新しいパネルが開きます。
[タスクの実行/テキストモードの切り替え]ボタン（次のスクリーンショットのカーソルの位置）を選択します。

「実行」パネルが更新され、SHA-1フィンガープリントなど、プロジェクトに関する多くの情報が表示されます。

Google Cloud Platformアカウントを作成します

必要なAPIキーを取得するには、Google Cloud Platform（GPC）アカウントが必要です。

アカウントを持っていない場合は、Try Cloud Platform for freeページに移動し、指示に従って12か月の無料トライアルにサインアップできます。クレジットカードまたはデビットカードが必要ですが、よくある質問ページによると、これは本人確認のためにのみ使用され、「無料トライアル中に請求または請求されることはありません。」

Poly APIキーを取得する

すべてサインアップしたら、Poly APIを有効にしてキーを作成できます。

GCPコンソールに移動します。
左上隅にある並んだアイコンを選択し、「APIとサービス>ダッシュボード」を選択します。
[APIとサービスを有効にする]を選択します。
左側のメニューで[その他]を選択します。
「Poly API」カードを選択します。
[有効にする]ボタンをクリックします。
しばらくすると、新しい画面に移動します。サイドメニューを開き、「APIとサービス>認証情報」を選択します。

後続のポップアップで、「キーを制限する」を選択します。
キーに固有の名前を付けます。
[アプリケーションの制限]で[Androidアプリ]を選択します。
[パッケージ名と指紋を追加]を選択します。
プロジェクトのSHA-1フィンガープリントをコピーして、「署名証明書フィンガープリント」フィールドに貼り付けます。
プロジェクトのパッケージ名を入力します（マニフェストとすべてのクラスファイルの上部に表示されます）。
[保存]をクリックします。

これで、プロジェクトの[認証情報]画面が表示されます。この画面には、作成したばかりのPoly対応APIキーを含む、すべてのAPIキーのリストが含まれています。

プロジェクトの依存関係：Fuel、P3D、Kotlin拡張機能

Polyアセットを取得して表示するには、いくつかの追加ライブラリからの支援が必要です。

燃料。 現在、Polyには公式のAndroidツールキットがないため、RESTインターフェースを使用してAPIを直接操作する必要があります。このプロセスを簡単にするために、Fuel HTTPネットワークライブラリを使用します。
Android向けの処理。 このライブラリのP3Dレンダラーを使用して、Polyアセットを表示します。

プロジェクトのbuild.gradleファイルを開き、次の2つのライブラリをプロジェクトの依存関係として追加します。

依存関係{implementation fileTree（include：、dir：libs）implementation "org.jetbrains.kotlin：kotlin-stdlib-jre7：$ kotlin_version" implementation com.android.support:appcompat-v7:27.1.1 //燃料ライブラリを追加/ / implementation com.github.kittinunf.fuel：fuel-android：1.13.0 // Androidエンジン用の処理を追加// implementation org.p5android：processing-core：4.0.1}

コードをより簡潔にするために、Kotlin Android拡張機能も使用するので、build.gradleファイルを開いた状態でこのプラグインを追加しましょう。

プラグインの適用：kotlin-android-extensions

最後に、インターネットからアセットを取得するため、アプリにはインターネットの許可が必要です。マニフェストを開き、次を追加します。

APIキーを追加する

アプリがPolyにアセットをリクエストするたびに、有効なAPIキーを含める必要があります。プレースホルダーテキストを使用していますが、あなたは しなければならない アプリケーションが機能する場合は、このプレースホルダーを独自のAPIキーに置き換えます。

また、「INSERT-YOUR-API-KEY」テキストの置き換えを忘れた場合にアプリケーションに警告が表示されるように、チェックも追加しています。

import android.os.Bundle import android.support.v7.app.AppCompatActivity class MainActivity：AppCompatActivity（）{コンパニオンオブジェクト{const val APIKey = "INSERT-YOUR-API-KEY"}オーバーライドfun onCreate（savedInstanceState：Bundle？）{ super.onCreate（savedInstanceState）setContentView（R.layout.activity_main）// APIキーが「INSERT」で始まる場合... // if（APIKey.startsWith（ "INSERT"））{//次にトーストを表示… .// Toast.makeText（this、 "あなたはAPIキーを更新していません"、Toast.LENGTH_SHORT）.show（）} else {... ... ...

資産の取得

Google Polyサイトで任意のアセットを選択できますが、この地球モデルを使用します。

URLスラッグの最後に表示されるID（前のスクリーンショットで強調表示）を使用して、アセットを取得します。このアセットIDとPoly APIホスト（「https://poly.googleapis.com/v1」）を組み合わせます。

次に、httpGet（）メソッドを使用して、アセットURLにGETリクエストを行う必要があります。また、応答タイプがJSONでなければならないことも指定しています。

アセットには、OBJ、GLTF、FBXなど、いくつかの形式があります。アセットがOBJ形式であることを確認する必要があります。

このステップでは、ダウンロードする必要があるすべてのファイルの名前とURLも取得します。
アセットのプライマリファイル（「ルート」）に加えて、関連するマテリアルおよびテクスチャファイル（「リソース」）が含まれます。

アプリケーションがアセットを正しく取得できない場合、トーストが表示されてユーザーに通知されます。

import android.content.Intent import android.os.Bundle import android.support.v7.app.AppCompatActivity import android.widget.Toast import com.github.kittinunf.fuel.android.extension.responseJson import com.github.kittinunf.fuel .httpDownload import com.github.kittinunf.fuel.httpGet import kotlinx.android.synthetic.main.activity_main。* import java.io.File class MainActivity：AppCompatActivity（）{companion object {const val APIKey = "INSERT-YOUR-API -KEY "val assetURL =" https://poly.googleapis.com/v1/assets/94XG1XUy10q "}オーバーライドfun onCreate（savedInstanceState：Bundle？）{super.onCreate（savedInstanceState）setContentView（R.layout.activity_main）if（ APIKey.startsWith（ "INSERT"））{Toast.makeText（this、 "You have have update your your API key"、Toast.LENGTH_SHORT）.show（）} else {//アセットURL // assetURLにGETリクエストを行います。 httpGet（listOf（ "key" to APIKey））。responseJson {request、response、result-> // response // result.fold（{val asset = it.obj（）var objectURL：String？ = null var materialLibraryName：String？ = null var materialLibraryURL：String？ = null //「formats」配列を使用してアセットの形式を確認する// val assetFormats = asset.getJSONArray（ "formats"）//すべての形式をループする// for（i in 0 until assetFormats.length（））{ val currentFormat = assetFormats.getJSONObject（i）// formatTypeを使用して、このリソースの形式タイプを識別します。形式がOBJの場合….// if（currentFormat.getString（ "formatType"）== "OBJ"）{// ...このリソースの「ルート」ファイル、つまりOBJ file // objectURL = currentFormatを取得します。 getJSONObject（ "root"）.getString（ "url"）//すべてのルートファイルの依存関係を取得// materialLibraryName = currentFormat.getJSONArray（ "resources"）.getJSONObject（0）.getString（ "relativePath"）materialLibraryURL = currentFormat.getJSONArray （ "resources"）.getJSONObject（0）.getString（ "url"）break}} objectURL !!。httpDownload（）。destination {_、_-> File（filesDir、 "globeAsset.obj"）} .response {_ 、_、result-> result.fold（{}、{// OBJファイルが見つからないかダウンロードできない場合は、エラーを表示します// Toast.makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT ）.show（）}）} materialLibraryURL !!。httpDownload（）。destination {_、_-> File（filesDir、materialLibraryName）} .response {_、_、result-> result.fold（{}、{Toast。 makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT）.show（）}）}}、{ Toast.makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT）.show（）}）}}}

この時点で、Androidスマートフォンまたはタブレット、またはAndroid Virtual Device（AVD）にプロジェクトをインストールすると、アセットは正常にダウンロードされますが、アプリは実際には表示しません。今すぐこれを修正しましょう！

2番目の画面の作成：ナビゲーションの追加

アセットをフルスクリーンモードで表示するため、main_activity.xmlファイルを更新して、タップするとフルスクリーンアクティビティを起動するボタンを追加します。

次に、onClickListenerをMainActivity.ktファイルの最後に追加しましょう。

import android.content.Intent import android.os.Bundle import android.support.v7.app.AppCompatActivity import android.widget.Toast import com.github.kittinunf.fuel.android.extension.responseJson import com.github.kittinunf.fuel .httpDownload import com.github.kittinunf.fuel.httpGet import kotlinx.android.synthetic.main.activity_main。* import java.io.File class MainActivity：AppCompatActivity（）{companion object {const val APIKey = "INSERT-YOUR-API -KEY "val assetURL =" https://poly.googleapis.com/v1/assets/94XG1XUy10q "}オーバーライドfun onCreate（savedInstanceState：Bundle？）{super.onCreate（savedInstanceState）setContentView（R.layout.activity_main）if（ APIKey.startsWith（ "INSERT"））{Toast.makeText（this、 "You have have update your your API key"、Toast.LENGTH_SHORT）.show（）} else {assetURL.httpGet（listOf（ "key" to APIKey））。 responseJson {リクエスト、レスポンス、結果-> result.fold（{val asset = it.obj（）var objectURL：String？= null var materialLibraryName：String？= null var materialLibraryURL：Str ？ = null val assetFormats = asset.getJSONArray（ "formats"）for（i in 0 to assetFormats.length（））{val currentFormat = assetFormats.getJSONObject（i）if（currentFormat.getString（ "formatType"）== "OBJ" ）{objectURL = currentFormat.getJSONObject（ "root"）.getString（ "url"）materialLibraryName = currentFormat.getJSONArray（ "resources"）.getJSONObject（0）.getString（ "relativePath"）materialLibraryURL = currentFormat.getJSONArray（ "resources" ）.getJSONObject（0）.getString（ "url"）break}} objectURL !!。httpDownload（）。destination {_、_-> File（filesDir、 "globeAsset.obj"）} .response {_、_、result -> result.fold（{}、{Toast.makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT）.show（）}）} materialLibraryURL !!。httpDownload（）。destination {_、_->ファイル（filesDir、materialLibraryName）} .response {_、_、result-> result.fold（{}、{Toast.makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT）.show（）}）}}、 {Toast.makeText（this、 "Unable to download resource"、Toast.LENGTH_SHORT）.sh ow（）}）} //ボタンを実装する// displayButton.setOnClickListener {val intent = Intent（this、SecondActivity :: class.java）startActivity（intent）; }}}

3Dキャンバスの構築

それでは、フルスクリーンモードでアセットを表示するアクティビティを作成しましょう。

Controlキーを押しながらプロジェクトのMainActivity.ktファイルをクリックし、「新規」>「Kotlinファイル/クラス」を選択します。
「種類」ドロップダウンを開き、「クラス」を選択します。
このクラスに「SecondActivity」という名前を付けて、「OK」をクリックします。

3Dオブジェクトを描画するには、3Dキャンバスが必要です！ Processing for AndroidのライブラリのP3Dレンダラーを使用します。つまり、PAppletクラスを拡張し、settings（）メソッドをオーバーライドしてから、fullScreen（）メソッドへの引数としてP3Dを渡します。また、PolyアセットをPShapeオブジェクトとして表すプロパティを作成する必要があります。

private fun displayAsset（）{val canvas3D = object：PApplet（）{var polyAsset：PShape？ = null fun設定をオーバーライド（）{fullScreen（PConstants.P3D）}

次に、setup（）メソッドをオーバーライドし、loadShape（）メソッドを呼び出して、.objファイルの絶対パスを渡すことにより、PShapeオブジェクトを初期化する必要があります。

オーバーライドfun setup（）{polyAsset = loadShape（File（filesDir、 "globeAsset.obj"）。absolutePath）}

P3Dのキャンバスに描く

この3Dキャンバスに描画するには、draw（）メソッドをオーバーライドする必要があります。

オーバーライドfun draw（）{background（0）shape（polyAsset）}}

デフォルトでは、Poly APIから取得したアセットの多くは小さい側にあるため、このコードを今実行すると、画面構成によってはアセットが表示されないこともあります。通常、3Dシーンを作成するときは、カスタムカメラを作成して、ユーザーがシーンを探索し、3Dアセットを360度完全に表示できるようにします。ただし、これはこの記事の範囲外なので、アセットのサイズと位置を手動で変更して、画面に快適に収まるようにします。

scale（）メソッドに負の値を渡すことで、アセットのサイズを増やすことができます。

スケール（-10f）

translate（）メソッドと次の座標を使用して、仮想3D空間でのアセットの位置を調整できます。

バツ。 水平軸に沿ってアセットを配置します。
Y. 垂直軸に沿ってアセットを配置します。
Z. これは「深さ/高さ」軸であり、2Dオブジェクトを3Dオブジェクトに変換します。正の値はオブジェクトがあなたの方に近づいている印象を作成し、負の値はオブジェクトがあなたから遠ざかっている印象を作成します。

変換は累積的であるため、関数が効果を累積した後に発生するすべてのことに注意してください。

私は次を使用しています：

translate（-50f、-100f、10f）

完成したコードは次のとおりです。

override fun draw（）{background（0）scale（-10f）translate（-50f、-100f）// shape（）メソッドを呼び出すことでアセットを描画します// shape（polyAsset）}}

次に、対応するレイアウトファイルを作成する必要があります。3DキャンバスをFrameLayoutウィジェットとして追加します。

Controlキーを押しながらプロジェクトの「res>レイアウト」フォルダーをクリックします。
「レイアウトリソースファイル」を選択します。
このファイルに「activity_second」という名前を付けて、「OK」をクリックします。

「asset_view」FrameLayoutができましたので、SecondActivityにそれを知らせる必要があります。 SecondActivity.ktファイルに戻って新しいPFragmentインスタンスを作成し、「asset_view」ウィジェットの方向に向けます。

import android.os.Bundle import android.support.v7.app.AppCompatActivity import kotlinx.android.synthetic.main.activity_second。* import processing.android.PFragment import processing.core.PApplet import processing.core.PConstants import processing.core .PShape import java.io.File class SecondActivity：AppCompatActivity（）{fun onCreate（savedInstanceState：Bundle？）をオーバーライドします{super.onCreate（savedInstanceState）setContentView（R.layout.activity_second）displayAsset（）} private fun displayAsset（）{val canvas3D = object：PApplet（）{var polyAsset：PShape？ = null override fun settings（）{fullScreen（PConstants.P3D）} override fun setup（）{polyAsset = loadShape（File（filesDir、 "globeAsset.obj"）。absolutePath）} override fun draw（）{background（0）scale （-10f）translate（-50f、-100f）shape（polyAsset）}} //次を追加// val assetView = PFragment（canvas3D）assetView.setView（asset_view、this）}}

最後のステップは、マニフェストにSecondActivityを追加することです。

//次を追加//

プロジェクトをテストする

これで、完成したプロジェクトをテストする準備ができました！ AndroidデバイスまたはAVDにインストールし、インターネット接続がアクティブであることを確認します。アプリが起動するとすぐに、アセットがダウンロードされ、[アセットを表示]ボタンをタップして表示できます。

この完全なプロジェクトはGitHubからダウンロードできます。

まとめ

この記事では、Poly APIを使用して実行時に3Dアセットを取得する方法と、Processing for Androidライブラリを使用してそのアセットを表示する方法について説明しました。 Poly APIには、より多くの人がVRとARの開発にアクセスできる可能性があると思いますか？以下のコメントでお知らせください！

コンテンツ

Polyを使用した3Dアセットの表示

3Dモデリングプロジェクトの作成

Google Cloud Platformアカウントを作成します

Poly APIキーを取得する

プロジェクトの依存関係：Fuel、P3D、Kotlin拡張機能

APIキーを追加する

資産の取得

2番目の画面の作成：ナビゲーションの追加

3Dキャンバスの構築

P3Dのキャンバスに描く

プロジェクトをテストする

まとめ

関連する

Verizon、Sprint、SamsungはGalaxy Note 8を早期に出荷しています

Samsung Galaxy Note 8は、3つの市場で安定したパイの更新を受け取ります

Intelモデムを使用している場合、5G iPhoneは2020年末まで遅延する可能性があります

最高のXiaomi Mi 9ケース

スマートホーム用に購入できるベストXiaomi Homeスマートデバイス