Skip to Content

Display Customer Locations Using a Fiori Map Control

Beginner
1 hr. 30 min.
SAP BTP SDK for Android, Beginner, Tutorial, SAP Business Technology Platform, Android, Mobile
Further customize the generated app to display customer locations on a map and try out the features of the Fiori Map control, including the toolbar, map panel, clustering, and map annotation.
You will learn
  • How to add a Google Map to the wizard-generated app and display customer locations
  • How to add a Fiori Map control and try out its features
flyingfish162Bruce MengNovember 18, 2022
Created by
flyingfish162
May 20, 2020
Contributors
sandeep-tds
flyingfish162
maximilianone

Prerequisites

A Fiori Map control extends the Google Maps SDK for Android or Esri ArcGIS Runtime SDK for Android. It provides additional APIs that handle clustering, as well as a toolbar, panel, and an editor to annotate map. For additional details, see Fiori Design Guidelines.

  • Step 1

    In this section you will create a new activity to display a map.

  • Step 2

    In this section, you will add code to place a marker on the map for each customer.

    Based on the where statement, customers from which countries are shown on the map?

  • Step 3

    In this section, you will add code to display the customer detail screen when the info marker is tapped.

  • Step 4

    In this section, you will create a new activity that uses the Fiori Map control.

    What are some differences between the Google map activity and Fiori Google map activity?

  • Step 5

    In this section, the bottom panel will be populated with details of the selected marker and an action will be implemented to enable navigation to the selected customer’s detail page.

  • Step 6

    In this section you will implement the settings dialog to include a map type setting and a clustering toggle.

    Congratulations! You have now successfully added a Fiori Map to an application and tried out some of the features it provides.

    What is clustering?

  • Step 7

    In this section, you will test the three different types of annotations.

    In order to redraw the points the next time the map is opened, you must save and store them in the app using the on save click listener.

    What type of annotations can you draw on the map?

  • Step 8

    In this section you will customize the map markers based on the customer’s country. The different marker colors will be recorded in the legend as well.

    Congratulations. You have created an activity that makes use of the Fiori map control.

    What object is used to customize markers?

  • Step 9

    In this section, an EsriFioriMapView will be used.

    Because Esri maps use a native library, and some Android devices have 64-bit processors, these devices generate and check the arm64 folder to load a native library. So, if you cannot run the app properly in this step, try the following solution:

    1. Add the following filters to the defaultConfig section in your app module’s build.gradle file. When your device tries to run your app, it will not generate any folders and will use the existing native library.

      Gradle
      Copy
      ndk {
    abiFilters "armeabi-v7a", "x86", "armeabi", "mips"
}

    2. Add the following code to your gradle.properties (Project Properties) to use the deprecated ndk.

      Gradle
      Copy
      android.useDeprecatedNdk=true

    Congratulations. You have created an activity that makes use of the Fiori map control.

Back to Top
Back to top