用AR Engine手部骨骼跟蹤能力實現虛擬手錶試戴

2022-09-28 12:02:14

AR技術的落地應用,推動著電商領域的不斷升級,通過擴增實境為使用者帶來了虛擬與現實結合的AR購物體驗。如AR試衣、AR試鞋、AR試妝等功能的出現讓使用者在手機上就能體驗產品的佩戴效果,可以讓使用者更直觀、更真實的瞭解產品資訊,提升消費者的購物愉悅感,幫助電商應用提高購物轉化率。華為AR Engine也為AR購物提供了實現方案,使用手部跟蹤能力即可實現虛擬手錶試戴。

效果展示

實現方法

AR Engine提供手部骨骼跟蹤能力,可以識別跟蹤21個手部關節點的位置和姿態,形成手部骨骼模型。通過手勢識別能力,可以給AR應用提供互動功能並實現一些趣味玩法,比如可以將AR世界中的虛擬物體置放到人的手部更精確的位置,如手指尖、手掌心等;還可驅動虛擬手做出更精細的動作。下面我會展示虛擬手錶試戴功能的具體開發步驟。

整合步驟

開發環境要求:
JDK 1.8.211及以上。

安裝Android Studio 3.0及以上:

minSdkVersion 26及以上

targetSdkVersion 29(推薦)

compileSdkVersion 29(推薦)

Gradle 6.1.1及以上(推薦)

在華為終端裝置上的應用市場下載AR Engine伺服器端APK(需在華為應用市場,搜尋「華為AR Engine」)並安裝到終端裝置。

測試應用的裝置:參見AREngine特性軟硬體依賴表。如果同時使用多個HMS Core的服務,則需要使用各個Kit對應的最大值。

開發準備

  1. 在開發應用前需要在華為開發者聯盟網站上註冊成為開發者並完成實名認證,具體方法請參見帳號註冊認證

  2. 華為提供了Maven倉整合方式的AR Engine SDK包,在開始開發前,需要將AR Engine SDK整合到您的開發環境中。

  3. Android Studio的程式碼庫設定在Gradle外掛7.0以下版本、7.0版本和7.1及以上版本有所不同。請根據您當前的Gradle外掛版本,選擇對應的設定過程。

  4. 以7.0為例:

開啟Android Studio專案級「build.gradle」檔案,新增Maven程式碼庫。

在「buildscript > repositories」中設定HMS Core SDK的Maven倉地址。

buildscript {
    	repositories {
        	google()
        	jcenter()
        	maven {url "https://developer.huawei.com/repo/" }
    	}
}

開啟專案級「settings.gradle」檔案,設定HMS Core SDK的Maven倉地址

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    		repositories {
       			 repositories {
           			 	google()
            			jcenter()
            			maven {url "https://developer.huawei.com/repo/" }
       			 }
   			 }
}
  1. 新增依賴 在「dependencies」中新增如下編譯依賴:
dependencies {
    implementation 'com.huawei.hms:arenginesdk:{version}
}

應用開發

1.執行前驗證:檢查當前裝置是否安裝了AR Engine,若已經安裝則正常執行,若沒有安裝,App應採用合適的方式提醒使用者安裝AR Engine,如主動跳轉應用市場,請求安裝AR Engine。具體實現程式碼如下

boolean isInstallArEngineApk =AREnginesApk.isAREngineApkReady(this);
if (!isInstallArEngineApk) {
    		// ConnectAppMarketActivity.class為跳轉應用市場的Activity。
startActivity(new Intent(this, com.huawei.arengine.demos.common.ConnectAppMarketActivity.class));
   		isRemindInstall = true;
}

2.初始化AR場景:AREngine提供5種場景,包括運動跟蹤(ARWorldTrackingConfig)、人臉跟蹤(ARFaceTrackingConfig)、手部識別(ARHandTrackingConfig)、人體跟蹤(ARBodyTrackingConfig)和影象識別(ARImageTrackingConfig)。

呼叫ARHandTrackingConfig介面,初始化手部識別。

mArSession = new ARSession(context);
ARHandTrackingConfig config = new ARHandTrackingconfig(mArSession);
  1. 獲取到ARhandTrackingconfig後,可以設定使用相機的前置或者後置等等一些可選的方法:
Config.setCameraLensFacing(ARConfigBase.CameraLensFacing.FRONT);
  1. 你需要把你獲取到的手部識別獲取到的config設定到ArSession中,然後啟動手部識別場景:
mArSession.configure(config);
mArSession.resume();
  1. 初始化HandSkeletonLineDisplay類,此類是根據手骨架點的座標來繪製手骨架線:
Class HandSkeletonLineDisplay implements HandRelatedDisplay{
//此類需要幾個方法
//初始化方法
public void init(){
}
//繪製手骨架點的方法,這裡需要傳入ARHand物件,用來獲取資料
public void onDrawFrame(Collection<ARHand> hands,){

    //呼叫getHandskeletonArray()方法用來獲取手部關節點座標資料
        Float[] handSkeletons  =  hand.getHandskeletonArray();

        //把handSkeletons傳入到實時更新資料方法中
        updateHandSkeletonsData(handSkeletons);

}
//更新骨架點的連線資料,在更新任何幀的時候呼叫此方法
public void updateHandSkeletonLinesData(){

//用來建立並初始化緩衝區物件的資料儲存
GLES20.glBufferData(…,mVboSize,…);

//用來更新緩衝區物件中的資料
GLES20.glBufferSubData(…,mPointsNum,…);

}
}
  1. 初始化HandRenderManager類,此類是來渲染從HUAWEI AREngine獲取的資料
Public class HandRenderManager implements GLSurfaceView.Renderer{
	
	//設定ARSession物件,用於獲取onDrawFrame方法中的最新資料。
	Public void setArSession(){
	}
}
  1. 在HandRenderManager類中,初始化onDrawFrame()方法:
Public void onDrawFrame(){
//在這個方法中呼叫了setCameraTextureName(),update()等方法用來更新ArEngine的計算結果
//應用在獲取到最新資料時來呼叫此介面。
mSession.setCameraTextureName();
ARFrame arFrame = mSession.update();
ARCamera arCamera = arFrame.getCamera();
//獲取人體手部跟蹤時返回的跟蹤結果 
Collection<ARHand> hands =  mSession.getAllTrackables(ARHand.class);
     //把獲取到的hands物件迴圈傳入更新手勢識別資訊方法中,進行處理
     For(ARHand hand  :  hands){
         updateMessageData(hand);
}
}

8.最後在展示效果的HandActivity頁面,給SurfaceView 設定渲染器。

mSurfaceView.setRenderer(mHandRenderManager);
設定渲染模式
mSurfaceView.setRenderMode(GLEurfaceView.RENDERMODE_CONTINUOUSLY);

具體實現可參考範例程式碼

瞭解更多詳情>>

存取華為開發者聯盟官網
獲取開發指導檔案
華為移動服務開源倉庫地址:GitHubGitee

關注我們,第一時間瞭解 HMS Core 最新技術資訊~