Intermediate: Integration of Huawei map kit and Location kit in DeliveryApp (Cross platform)

Shiddalingeshwar M S
3 min readApr 23, 2021

--

In this article, we will be integrating Huawei Map kit and Location kit in Food Delivery application. Huawei Map kit currently allows developer to create map, interactions with map and drawing on a map.

Introduction

In this article, we will be integrating Huawei Map kit and Location kit in Food Delivery application. Huawei Map kit currently allows developer to create map, interactions with map and drawing on a map.

We will be covering all three aspects as the delivery application we need to create map and we need to draw polyline from delivery agent location to user location and on interaction also we are providing i.e. on click the marker we are show popup on the map with details as shown in the result section below.

Development Overview

You need to install Flutter and Dart plugin in IDE and I assume that you have prior knowledge about the Flutter and Dart.

Hardware Requirements

  • A computer (desktop or laptop) running Windows 10.
  • A Huawei phone (with the USB cable), which is used for debugging.

Software Requirements

  • Java JDK 1.7 or later.
  • Android studio software or Visual Studio or Code installed.
  • HMS Core (APK) 4.X or later.

Integration process

Step 1. Create flutter project

Step 2. Add the App level gradle dependencies. Choose inside project Android > app > build.gradle.

Add root level gradle dependencies

Add app level gradle dependencies

Step 3: Add the below permissions in Android Manifest file.

Step 4: Add below path in pubspec.yaml file under dependencies.

Step 5 : Create a project in AppGallery Connect

How to check required permissions are granted or not?

How do I request permission?

How do I get location data?

Result

Tricks and Tips

  • Make sure you have downloaded latest plugin.
  • Make sure that updated plugin path in yaml.
  • Make sure that plugin unzipped in parent directory of project.
  • Makes sure that agconnect-services.json file added.
  • Make sure dependencies are added build file.
  • Run flutter pug get after adding dependencies.
  • Generating SHA-256 certificate fingerprint in android studio and configure in Ag-connect.

Conclusion

In this article, we have learnt how to integrate Huawei Map kit and Location kit in Flutter for the DeliveryApp, where application gets the list of orders and delivery agent click on the order to navigate to map. Similar way you can use Huawei Map kit as per user requirement in your application.

Thank you so much for reading, I hope this article helps you to understand the Huawei Map kit and Location kit in flutter.

References

Flutter map

Flutter plugin

Location Kit

Checkout in forum

GitHub repo for Map Kit

GitHub repo for Location Kit

--

--

No responses yet