DZone
Thanks for visiting DZone today,
Edit Profile
  • Manage Email Subscriptions
  • How to Post to DZone
  • Article Submission Guidelines
Sign Out View Profile
  • Post an Article
  • Manage My Drafts
Over 2 million developers have joined DZone.
Log In / Join
Refcards Trend Reports
Events Video Library
Refcards
Trend Reports

Events

View Events Video Library

Zones

Culture and Methodologies Agile Career Development Methodologies Team Management
Data Engineering AI/ML Big Data Data Databases IoT
Software Design and Architecture Cloud Architecture Containers Integration Microservices Performance Security
Coding Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks
Culture and Methodologies
Agile Career Development Methodologies Team Management
Data Engineering
AI/ML Big Data Data Databases IoT
Software Design and Architecture
Cloud Architecture Containers Integration Microservices Performance Security
Coding
Frameworks Java JavaScript Languages Tools
Testing, Deployment, and Maintenance
Deployment DevOps and CI/CD Maintenance Monitoring and Observability Testing, Tools, and Frameworks

Low-Code Development: Leverage low and no code to streamline your workflow so that you can focus on higher priorities.

DZone Security Research: Tell us your top security strategies in 2024, influence our research, and enter for a chance to win $!

Launch your software development career: Dive head first into the SDLC and learn how to build high-quality software and teams.

Open Source Migration Practices and Patterns: Explore key traits of migrating open-source software and its impact on software development.

Related

  • How To Integrate the Stripe Payment Gateway Into a React Native Application
  • Commonly Occurring Errors in Microsoft Graph Integrations and How To Troubleshoot Them (Part 4)
  • DZone Community Awards 2022
  • Exploring the Salesforce Mobile SDK Using Android Studio

Trending

  • Tenv v2.0: The Importance of Explicit Behavior for Version Manager
  • Building an Effective Zero Trust Security Strategy for End-To-End Cyber Risk Management
  • Operational Excellence Best Practices
  • The Art of Manual Regression Testing
  1. DZone
  2. Data Engineering
  3. AI/ML
  4. Building a Hand Gesture Game

Building a Hand Gesture Game

How to make a more immersive game.

By 
Guo Tiecheng user avatar
Guo Tiecheng
·
Dec. 26, 20 · Tutorial
Like (2)
Save
Tweet
Share
3.8K Views

Join the DZone community and get the full member experience.

Join For Free

Introduction

Have you already piled the products you want to buy into your online shopping cart? What if you're feeling a little more frugal and want to save your hard-earned cash instead? Fortunately, there is Crazy Shopping Cart, a fast-paced and addictive virtual shopping game that integrates HUAWEI ML Kit's hand keypoint detection service to allow you to control a virtual shopping cart using hand gestures. In this post, I'll show you how the game's hand gesture control feature was developed using ML Kit.

How to Play

Players perform hand gestures to control the left-right movement of a shopping cart and collect as many items as possible. The cart speeds up every 15 seconds.


Looks fun right? Let's take a look at how the game's hand gesture control system is developed.

Development Process

1. Configure the Maven repository address.

Open the build.gradle file in the root directory of your Android Studio project.

Groovy
xxxxxxxxxx
1
19
 
1
buildscript {
2
    repositories {
3
        google()
4
        jcenter()
5
        maven {url 'https://developer.huawei.com/repo/'}
6
    }
7
    dependencies {
8
        ...
9
        classpath 'com.huawei.agconnect:agcp:1.4.1.300'
10
    }
11
}
12
 
13
allprojects {
14
    repositories {
15
        google()
16
        jcenter()
17
        maven {url 'https://developer.huawei.com/repo/'}
18
    }
19
}


2. Perform integration in full SDK mode. 

Java
 




xxxxxxxxxx
1


 
1
dependencies{
2
    // Import the base SDK.
3
    implementation 'com.huawei.hms:ml-computer-vision-handkeypoint:2.0.4.300'
4
    // Import the hand keypoint detection model package.
5
    implementation 'com.huawei.hms:ml-computer-vision-handkeypoint-model:2.0.4.300'
6
}



After integrating the SDK, add the following configuration to the file header:

Add apply plugin: 'com.huawei.agconnect' after apply plugin: 'com.android.application'.


3. Create a hand keypoint analyzer. 

Java
xxxxxxxxxx
1
 
1
MLHandKeypointAnalyzer analyzer =MLHandKeypointAnalyzerFactory.getInstance().getHandKeypointAnalyzer();


4. Create the detection result processing class HandKeypointTransactor. 

Java
 




xxxxxxxxxx
1
13


 
1
public class HandKeypointTransactor implements MLAnalyzer.MLTransactor<List<MLHandKeypoints>> {
2
    @Override
3
    public void transactResult(MLAnalyzer.Result<List<MLHandKeypoints>> results) {
4
        SparseArray<List<MLHandKeypoints>> analyseList = results.getAnalyseList();
5
        // Process the detection result as required.
6
        // Other detection-related APIs provided by ML Kit cannot be called.
7
    }
8
    @Override
9
    public void destroy() {
10
        // Callback method used to release resources when detection completes.
11
    }
12
}



5. Set the detection result processor, and bind it to the analyzer. 

Java
 




xxxxxxxxxx
1


 
1
analyzer.setTransactor(new HandKeypointTransactor());



6. Create a LensEngine instance. 

Java
 




xxxxxxxxxx
1


 
1
LensEngine lensEngine = new LensEngine.Creator(getApplicationContext(), analyzer)
2
    .setLensType(LensEngine.BACK_LENS)
3
    .applyDisplayDimension(1280, 720)
4
    .applyFps(20.0f)
5
    .enableAutomaticFocus(true)
6
    .create();



7. Call the run method to start the camera and read video streams for detection. 

Java
 




xxxxxxxxxx
1


 
1
// Implement other logic of the SurfaceView control by yourself.
2
SurfaceView mSurfaceView = findViewById(R.id.surface_view);
3
try {
4
    lensEngine.run(mSurfaceView.getHolder());
5
} catch (IOException e) {
6
    // Handle exceptions.
7
}



8. After the detection is complete, stop the analyzer, and release detection resources. 

Java
 




xxxxxxxxxx
1


 
1
if (analyzer != null) {
2
    analyzer.stop();
3
}
4
if (lensEngine != null) {
5
    lensEngine.release();
6
}



Summary

As you can see, the development process is really simple and fast. In addition to adding hand gesture control to your mobile games, ML Kit's hand keypoint detection service also has many other useful applications. For example, users can add cute or funny special effects to their videos when using short-video apps with this service integrated. Also, users of smart home apps with this service integrated can customize the hand gestures they use to remotely control appliances.

Try the service out for yourself now by integrating HUAWEI ML Kit with your own apps.

GitHub Demo

References

Official website of Huawei Developers

Development Guide

HMS Core official community on Reddit

Demo and sample code

Discussions on Stack Overflow

Java (programming language) mobile app Machine learning Android Studio Stack overflow Integration Software development kit

Opinions expressed by DZone contributors are their own.

Related

  • How To Integrate the Stripe Payment Gateway Into a React Native Application
  • Commonly Occurring Errors in Microsoft Graph Integrations and How To Troubleshoot Them (Part 4)
  • DZone Community Awards 2022
  • Exploring the Salesforce Mobile SDK Using Android Studio

Partner Resources


Comments

ABOUT US

  • About DZone
  • Send feedback
  • Community research
  • Sitemap

ADVERTISE

  • Advertise with DZone

CONTRIBUTE ON DZONE

  • Article Submission Guidelines
  • Become a Contributor
  • Core Program
  • Visit the Writers' Zone

LEGAL

  • Terms of Service
  • Privacy Policy

CONTACT US

  • 3343 Perimeter Hill Drive
  • Suite 100
  • Nashville, TN 37211
  • support@dzone.com

Let's be friends: