Crazy Rockets-教你如何集成华为HMS ML Kit人脸检测和手势识别打造爆款小游戏

Posted 2020-12-21

前言

不知道有多少人和小编一样时不时就被一些小游戏刷屏，这些游戏操作简单，老少皆宜，传播速度非常的快，分分钟霸屏朋友圈。小编也有一个梦想，希望自己有一天也能做出能够霸屏朋友圈的小游戏。但是要做出来一个这样的爆款小游戏可不是一件简单的事情，于是小编开始在网上收集信息，终于发现华为HMS ML Kit提供的人脸检测和手部关键点识别可以通过人脸以及手部关键点检测来实现游戏的趣味性。

应用场景

HMS ML Kit人脸检测服务对人脸多达855个关键点进行检测，返回人脸轮廓、眉毛、眼睛、鼻子、嘴巴、耳朵等部位的坐标以及人脸偏转角度等信息。集成人脸检测服务后开发者可以根据这些信息快速构建人脸美化的应用，或者在脸上加一些有趣的元素，增加图片的趣味性。

手部关键点识别技术在生活中有很多的应用场景。比如拍摄短视频的软件在集成了这种技术后，可以根据手部关键点生成一些可爱或者搞笑的特效，增加短视频的趣味性。

Crazy Rockets这款游戏集成了上述两个服务共同开发，这款游戏一共有两种玩法，一种是通过人脸的上下移动来控制火箭穿梭，通过巨石阵。另一种是通过手势的上下移动来控制火箭穿梭，通过巨石阵。两种方式都是通过检测人脸和手部关键点来反馈信息，进而控制火箭移动，趣味十足，下面就先来看看游戏展示吧！

怎么样？是不是很心动，那就跟着小编一起来看看怎么集成HMS ML Kit人脸检测能力来实现小游戏(Crazy Rockets)制作吧。

开发实战

详细的准备步骤可以参考华为开发者联盟：

https://developer.huawei.com/consumer/cn/doc/development/HMS-Guides/ml-process-4

这里列举关键的开发步骤。

一．人脸

1.配置maven仓库

在“allprojects > repositories”中配置HMS Core SDK的Maven仓地址。

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

在“buildscript > repositories”中配置HMS Core SDK的Maven仓地址。

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

在“buildscript > dependencies”中增加agcp配置。

dependencies {
        ...        
        classpath ‘com.huawei.agconnect:agcp:1.3.1.300‘    
     }    
}

2.集成sdk

Implementation  ‘com.huawei.hms:ml-computer-vision-face:2.0.1.300‘

3.创建人脸分析器

MLFaceAnalyzer analyzer = MLAnalyzerFactory.getInstance().getFaceAnalyzer();

4.创建处理类

public class FaceAnalyzerTransactor implements MLAnalyzer.MLTransactor<MLFace> {
    @Override
    public void transactResult(MLAnalyzer.Result<MLFace> results) {
        SparseArray<MLFace> items = results.getAnalyseList();
        // 开发者根据需要处理识别结果，需要注意，这里只对检测结果进行处理。
        // 不可调用ML Kit提供的其他检测相关接口。
    }
    @Override
    public void destroy() {
        // 检测结束回调方法，用于释放资源等。
    }
}

5.创建LensEngine，用于捕捉相机动态视频流并传入分析器

LensEngine lensEngine = new LensEngine.Creator(getApplicationContext(), analyzer)
    .setLensType(LensEngine.BACK_LENS)
    .applyDisplayDimension(1440, 1080)
    .applyFps(30.0f)
    .enableAutomaticFocus(true)
    .create();

6.调用run方法，启动相机，读取视频流，进行识别

// 请自行实现SurfaceView控件的其他逻辑。
SurfaceView mSurfaceView = findViewById(R.id.surface_view);
try {
    lensEngine.run(mSurfaceView.getHolder());
} catch (IOException e) {
    // 异常处理逻辑。
}

7.释放检测资源

if (analyzer != null) {
    try {
        analyzer.stop();
    } catch (IOException e) {
         // 异常处理。
    }
}
if (lensEngine != null) {
    lensEngine.release();
}

二．手势识别

1.配置maven仓库

在“allprojects > repositories”中配置HMS Core SDK的Maven仓地址。

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

在“buildscript > repositories”中配置HMS Core SDK的Maven仓地址。

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

在“buildscript > dependencies”中增加agcp配置。

dependencies {
        ...        
        classpath ‘com.huawei.agconnect:agcp:1.3.1.300‘    
     }
 }

2.集成sdk

// 引入基础SDK
implementation ‘com.huawei.hms:ml-computer-vision-handkeypoint:2.0.4.300‘
// 引入手部关键点检测模型包
implementation ‘com.huawei.hms:ml-computer-vision-handkeypoint-model:2.0.4.300‘

3.创建默认手势分析器

 MLHandKeypointAnalyzer analyzer =MLHandKeypointAnalyzerFactory.getInstance().getHandKeypointAnalyzer();

4.创建处理类

public class HandKeypointTransactor implements MLAnalyzer.MLTransactor<List<MLHandKeypoints>> {
@Override
public void transactResult(MLAnalyzer.Result<List<MLHandKeypoints>> results) {
SparseArray<List<MLHandKeypoints>> analyseList = results.getAnalyseList();
// 开发者根据需要处理识别结果，需要注意，这里只对检测结果进行处理。
// 不可调用ML Kit提供的其他检测相关接口。
}
@Override
public void destroy() {
// 检测结束回调方法，用于释放资源等。
}
}

5.设置处理类

analyzer.setTransactor(new HandKeypointTransactor());

6.创建Lengengine

LensEngine lensEngine = new LensEngine.Creator(getApplicationContext(), analyzer)
.setLensType(LensEngine.BACK_LENS)
.applyDisplayDimension(1280, 720)
.applyFps(20.0f)
.enableAutomaticFocus(true)
.create();

7.调用run方法，启动相机，读取视频流，进行识别

// 请自行实现SurfaceView控件的其他逻辑。
SurfaceView mSurfaceView = findViewById(R.id.surface_view);
try {
lensEngine.run(mSurfaceView.getHolder());
} catch (IOException e) {
// 异常处理逻辑。
}

8．释放检测资源

if (analyzer != null) {
analyzer.stop();
}

if (lensEngine != null) {
lensEngine.release();
}

欲了解更多详情，请参阅：

华为开发者联盟官网：

https://developer.huawei.com/consumer/cn/hms/huawei-mlkit

获取开发指导文档：

https://developer.huawei.com/consumer/en/doc/development/HMSCore-Guides/service-introduction-0000001050040017

参与开发者讨论请到Reddit社区：https://www.reddit.com/r/HuaweiDevelopers/

下载demo和示例代码请到Github：https://github.com/HMS-Core

解决集成问题请到Stack Overflow：

https://stackoverflow.com/questions/tagged/huawei-mobile-services?tab=Newest

---

原文链接：
https://developer.huawei.com/consumer/cn/forum/topic/0201388581574050067?fid=18&pid=0301388581574050321
作者：timer