用AR Engine手部骨骼跟踪能力实现虚拟手表试戴

AR技术的落地应用,推动着电商领域的不断升级,通过增强现实为用户带来了虚拟与现实结合的AR购物体验。如AR试衣、AR试鞋、AR试妆等功能的出现让用户在手机上就能体验产品的佩戴效果,可以让用户更直观、更真实的了解产品信息,提升消费者的购物愉悦感,帮助电商应用提高购物转化率。华为AR Engine也为AR购物提供了实现方案,使用手部跟踪能力即可实现虚拟手表试戴。

效果展示

用AR Engine手部骨骼跟踪能力实现虚拟手表试戴

实现方法

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,){

    //&#x8C03;&#x7528;getHandskeletonArray()&#x65B9;&#x6CD5;&#x7528;&#x6765;&#x83B7;&#x53D6;&#x624B;&#x90E8;&#x5173;&#x8282;&#x70B9;&#x5750;&#x6807;&#x6570;&#x636E;
        Float[] handSkeletons  =  hand.getHandskeletonArray();

        //&#x628A;handSkeletons&#x4F20;&#x5165;&#x5230;&#x5B9E;&#x65F6;&#x66F4;&#x65B0;&#x6570;&#x636E;&#x65B9;&#x6CD5;&#x4E2D;
        updateHandSkeletonsData(handSkeletons);

}
//&#x66F4;&#x65B0;&#x9AA8;&#x67B6;&#x70B9;&#x7684;&#x8FDE;&#x63A5;&#x6570;&#x636E;&#xFF0C;&#x5728;&#x66F4;&#x65B0;&#x4EFB;&#x4F55;&#x5E27;&#x7684;&#x65F6;&#x5019;&#x8C03;&#x7528;&#x6B64;&#x65B9;&#x6CD5;
public void updateHandSkeletonLinesData(){

//&#x7528;&#x6765;&#x521B;&#x5EFA;&#x5E76;&#x521D;&#x59CB;&#x5316;&#x7F13;&#x51B2;&#x533A;&#x5BF9;&#x8C61;&#x7684;&#x6570;&#x636E;&#x5B58;&#x50A8;
GLES20.glBufferData(&#x2026;,mVboSize,&#x2026;);

//&#x7528;&#x6765;&#x66F4;&#x65B0;&#x7F13;&#x51B2;&#x533A;&#x5BF9;&#x8C61;&#x4E2D;&#x7684;&#x6570;&#x636E;
GLES20.glBufferSubData(&#x2026;,mPointsNum,&#x2026;);

}
}
</arhand>
  1. 初始化HandRenderManager类,此类是来渲染从HUAWEI AREngine获取的数据
Public class HandRenderManager implements GLSurfaceView.Renderer{

    //&#x8BBE;&#x7F6E;ARSession&#x5BF9;&#x8C61;&#xFF0C;&#x7528;&#x4E8E;&#x83B7;&#x53D6;onDrawFrame&#x65B9;&#x6CD5;&#x4E2D;&#x7684;&#x6700;&#x65B0;&#x6570;&#x636E;&#x3002;
    Public void setArSession(){
    }
}
  1. 在HandRenderManager类中,初始化onDrawFrame()方法:
Public void onDrawFrame(){
//&#x5728;&#x8FD9;&#x4E2A;&#x65B9;&#x6CD5;&#x4E2D;&#x8C03;&#x7528;&#x4E86;setCameraTextureName(),update()&#x7B49;&#x65B9;&#x6CD5;&#x7528;&#x6765;&#x66F4;&#x65B0;ArEngine&#x7684;&#x8BA1;&#x7B97;&#x7ED3;&#x679C;
//&#x5E94;&#x7528;&#x5728;&#x83B7;&#x53D6;&#x5230;&#x6700;&#x65B0;&#x6570;&#x636E;&#x65F6;&#x6765;&#x8C03;&#x7528;&#x6B64;&#x63A5;&#x53E3;&#x3002;
mSession.setCameraTextureName();
ARFrame arFrame = mSession.update();
ARCamera arCamera = arFrame.getCamera();
//&#x83B7;&#x53D6;&#x4EBA;&#x4F53;&#x624B;&#x90E8;&#x8DDF;&#x8E2A;&#x65F6;&#x8FD4;&#x56DE;&#x7684;&#x8DDF;&#x8E2A;&#x7ED3;&#x679C;
Collection<arhand> hands =  mSession.getAllTrackables(ARHand.class);
     //&#x628A;&#x83B7;&#x53D6;&#x5230;&#x7684;hands&#x5BF9;&#x8C61;&#x5FAA;&#x73AF;&#x4F20;&#x5165;&#x66F4;&#x65B0;&#x624B;&#x52BF;&#x8BC6;&#x522B;&#x4FE1;&#x606F;&#x65B9;&#x6CD5;&#x4E2D;,&#x8FDB;&#x884C;&#x5904;&#x7406;
     For(ARHand hand  :  hands){
         updateMessageData(hand);
}
}
</arhand>

8.最后在展示效果的HandActivity页面,给SurfaceView 设置渲染器。

mSurfaceView.setRenderer(mHandRenderManager);
&#x8BBE;&#x7F6E;&#x6E32;&#x67D3;&#x6A21;&#x5F0F;
mSurfaceView.setRenderMode(GLEurfaceView.RENDERMODE_CONTINUOUSLY);

具体实现可参考示例代码

了解更多详情>>

访问华为开发者联盟官网
获取开发指导文档
华为移动服务开源仓库地址:GitHubGitee

关注我们,第一时间了解 HMS Core 最新技术资讯~

Original: https://www.cnblogs.com/hmscore/p/16736815.html
Author: HMSCore技术团队
Title: 用AR Engine手部骨骼跟踪能力实现虚拟手表试戴

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/801788/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球