HUAWEI Location Kit Cordova Startup Project

Hi everyone, let’s create a Cordova android mobile application that uses the HUAWEI Location Kit. Before I start create the android mobile application, I would like to talk about the possibilities that HUAWEI Location Kit provides.

I will share the GitHub link of the project at the end of the article. (:

HUAWEI Location Kit

About HUAWEI Location Kit

Huawei Location Kit combines the GPS(Global Positioning System), Wi-Fi, and base station locations to help you quickly obtain precise user locations, build up global positioning capabilities, and reach a wide range of users around the globe. Currently, it provides the three main capabilities: Fused Location, Activity Identification, and Geofence.

• Fused Location: Quickly obtain the device location based on the Wi-Fi, GPS and base station location data.
• Activity Identification: Identifies user motion status through the acceleration sensor, cellular network information, and magnetometer, helping you adjust your app based on user behavior.
• Geofence: Allows you to set an interested area through an API so that your app can receive a notification when a specified action such as leaving, entering, or lingering in the area occurs.

HUAWEI Mobile Services Advantages

HAUWEI Mobile Service - Location Kit

Location Kit

FAQs HUAWEI Location Kit

Create Cordova Application

Apache Cordova

⋆ Prerequisites: npm, Node.js and Cordova CLI(Command Line Interface) should be installed.

Let’s create a Cordova project using Cordova CLI in the Windows operating system and then add the Android platform to the project.

# create a cordova application using Cordova CLI
$ cordova create HmsLocationKitDemo com.hms.kitdemo HmsLocation

• Project Folder: HmsLocationKitDemo
• Package Name: com.hms.kitdemo
• App Name: HmsLocation

# add android platform to project using Cordova CLI
$ cd HmsLocationDemo
$ cordova platform add android

Apache Cordova

HMS(Huawei Mobile Services) Location Kit Plugin

The Cordova HMS Location Kit Plugin provides adaption code used for the Huawei Location Kit to use in Cordova platform.

HUAWEI Mobile Services Core 4.0

Add the cordova-plugin-hms-location plugin to your project using the command below.

# run command in root directory of your project
$ cordova plugin add @hmscore/cordova-plugin-hms-location
# Adding cordova-plugin-hms-location to package.json
# run project
$ cordova run android

The cordova-plugin-hms-location plugin has successfully added to the project.

For detailed information about the cordova-plugin-hms-location plugin:

@hmscore/cordova-plugin-hms-location

We can start using the HMS Location Kit plugin in project.

cordova-plugin-hms-location plugin directory

• src/main/com/huawei/hms/cordova/location: core layer that exposes LocationKitSDK functionality to JS(JavaScript) side.
• www/: Public interfaces for interacting LocationKitSDK through Cordova.

Modules Overview

Using the Cordova HMS Location Kit

Cordova Project Files

JS and HTML files that I created to use the cordova-plugin-hms-location plugin we have added in the Cordova project are in the picture left.

In order to show the use of the functions in the Cordova HMS Location-Kit, I created the following screens in the Cordova startup project.

index.html - fusedLocation.html

activityIdentification.html - geofences.html

JS file used in index.html file

Initialize the HMSLocationKit on line 33 of the index.js file. It will run the following Java code in the cordova-plugin-hms-location plugin.

/*part of HMSLocationKit.java*/
if (action.equals("init")) {
    Log.d(TAG, "init called.");
    HMSBroadcastReceiver.init(cordova, webView);
    callbackContext.success();}

A broadcast receiver is an Android component which allows you to register for system or application events.

First Screen - index.js

First screen of the HMS Location-Kit Cordova Startup Project: Cordova HMS Location-Kit provides the three main capabilities: Fused Location, Activity Identification, and Geofence. Let’s show relevant capabilities usage.

HMS Location Kit: Fused Location

For the fusedLocation JS file of the project: fusedLocation.js🔗

Capabilities Provided:

• Last Location
• Last Location With Address
• Mock Location
• Location Updates

HMS Location Kit References

To use HMS Fused Location, it needs to be initialized.

/*part of fusedLocation.js*/
// HMSFusedLocation initialize
HMSFusedLocation.init();

How to Enable Mock Location on Android For HmsLocation App

• In the “Developer Options” menu, scroll down to “Debugging” and activate the “Select mock location app”.

For Example: Get Last Location With Address

Fused Location Screen

Part of fusedLocation.js

HMS Location Kit: Location Request Code

HMS Location Kit: Activity Identification

For the activityIdentification JS file of the project: activityIdentification.js🔗

Capabilities Provided:

• Activity Conversion Updates
• Activity Conversion Request
• Activity Identification Updates
• Activity Identification Request

HMS Location Kit References

To use HMS Activity Identification, it needs to be initialized.

/*part of activityIdentification.js*/
// HMSActivityIdentification initialize
HMSActivityIdentification.init();

For Example: Activity Identification Updates

Activity Identification Screen

Activity Identification Constant - Value

Activity Identification Data Constans - Values

Part of activityIdentification.js

HMS LocationKit: Geofences

For the geofences JS file of the project: geofences.js🔗

Capabilities Provided:

• Geofences List
• Geofences Updates

HMS Location Kit References

To use HMS Geofences, it needs to be initialized.

/*part of geofences.js*/
// HMSGeofence initialize
HMSGeofence.init();

Part of geofences.js

In this article, I explained what is the HUAWEI Location Kit, what capabilities it provides, and how to use it in the Cordova application. If you have any questions, you can write the question in the comment section.

HMS Location Kit Cordova Startup Project GitHub

bagcimukremin/CordovaHmsLocationKitDemo